From 13ee385b599818a649276805a190bd66d24b0b66 Mon Sep 17 00:00:00 2001
From: onmax <maximogarciamtnez@gmail.com>
Date: Fri, 6 Mar 2026 10:37:26 +0100
Subject: [PATCH 1/6] feat(calendar): add month and year picker modes

---
 .../calendar/CalendarMonthPickerExample.vue   |  30 +
 .../calendar/CalendarYearPickerExample.vue    |  19 +
 docs/content/docs/2.components/calendar.md    |  79 +++
 src/runtime/components/Calendar.vue           | 586 ++++++++++++++++--
 src/theme/calendar.ts                         | 189 ++++--
 test/components/Calendar.spec.ts              | 276 ++++++++-
 .../__snapshots__/Calendar-vue.spec.ts.snap   | 138 +++--
 .../__snapshots__/Calendar.spec.ts.snap       | 138 +++--
 8 files changed, 1267 insertions(+), 188 deletions(-)
 create mode 100644 docs/app/components/content/examples/calendar/CalendarMonthPickerExample.vue
 create mode 100644 docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue

diff --git a/docs/app/components/content/examples/calendar/CalendarMonthPickerExample.vue b/docs/app/components/content/examples/calendar/CalendarMonthPickerExample.vue
new file mode 100644
index 0000000000..0d71a682b4
--- /dev/null
+++ b/docs/app/components/content/examples/calendar/CalendarMonthPickerExample.vue
@@ -0,0 +1,30 @@
+<script setup lang="ts">
+import type { CalendarDate } from '@internationalized/date'
+import { DateFormatter, getLocalTimeZone } from '@internationalized/date'
+
+const modelValue = shallowRef<CalendarDate>()
+const formatter = new DateFormatter('en-US', {
+  month: 'long',
+  year: 'numeric'
+})
+
+const label = computed(() => {
+  if (!modelValue.value) {
+    return 'Select month'
+  }
+
+  return formatter.format(modelValue.value.toDate(getLocalTimeZone()))
+})
+</script>
+
+<template>
+  <UPopover>
+    <UButton variant="outline" color="neutral" trailing-icon="i-lucide-calendar">
+      {{ label }}
+    </UButton>
+
+    <template #content>
+      <UCalendar v-model="modelValue" type="month" />
+    </template>
+  </UPopover>
+</template>
diff --git a/docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue b/docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue
new file mode 100644
index 0000000000..01530c8f65
--- /dev/null
+++ b/docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue
@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import type { CalendarDate } from '@internationalized/date'
+
+const modelValue = shallowRef<CalendarDate>()
+
+const label = computed(() => modelValue.value ? String(modelValue.value.year) : 'Select year')
+</script>
+
+<template>
+  <UPopover>
+    <UButton variant="outline" color="neutral" trailing-icon="i-lucide-calendar">
+      {{ label }}
+    </UButton>
+
+    <template #content>
+      <UCalendar v-model="modelValue" type="year" />
+    </template>
+  </UPopover>
+</template>
diff --git a/docs/content/docs/2.components/calendar.md b/docs/content/docs/2.components/calendar.md
index cb26a7b2fd..7f87fc6fbc 100644
--- a/docs/content/docs/2.components/calendar.md
+++ b/docs/content/docs/2.components/calendar.md
@@ -209,6 +209,65 @@ props:
 ---
 ::
 
+### Type
+
+Use the `type` prop to change the calendar picker type. Defaults to `date`.
+
+Set `type="month"` for a month-only picker.
+
+::component-code
+---
+cast:
+  modelValue: DateValue
+ignore:
+  - modelValue
+  - type
+external:
+  - modelValue
+props:
+  type: month
+  modelValue: [2022, 3, 1]
+---
+::
+
+Set `type="year"` for a year-only picker.
+
+::component-code
+---
+cast:
+  modelValue: DateValue
+ignore:
+  - modelValue
+  - type
+external:
+  - modelValue
+props:
+  type: year
+  modelValue: [2022, 1, 1]
+---
+::
+
+### Default View
+
+Use the `default-view` prop to set the initial view. Defaults to `day` when `type="date"`.
+
+::component-code
+---
+cast:
+  defaultValue: DateValue
+ignore:
+  - defaultView
+  - defaultValue
+external:
+  - defaultValue
+props:
+  defaultView: month
+  defaultValue: [2022, 2, 3]
+---
+::
+
+When using `type="date"`, the heading buttons let users switch between day, month, and year views.
+
 ## Examples
 
 ### With chip events
@@ -275,6 +334,26 @@ name: 'calendar-external-controls-example'
 ---
 ::
 
+### As a month picker
+
+Use `type="month"` with a [Popover](/docs/components/popover) to create a month picker.
+
+::component-example
+---
+name: 'calendar-month-picker-example'
+---
+::
+
+### As a year picker
+
+Use `type="year"` with a [Popover](/docs/components/popover) to create a year picker.
+
+::component-example
+---
+name: 'calendar-year-picker-example'
+---
+::
+
 ### As a date picker
 
 Use a [Button](/docs/components/button) and a [Popover](/docs/components/popover) component to create a date picker.
diff --git a/src/runtime/components/Calendar.vue b/src/runtime/components/Calendar.vue
index 19bc43fd84..368a599913 100644
--- a/src/runtime/components/Calendar.vue
+++ b/src/runtime/components/Calendar.vue
@@ -3,6 +3,7 @@ import type { CalendarRootProps, CalendarRootEmits, RangeCalendarRootProps, Rang
 import { getWeekNumber } from 'reka-ui/date'
 import type { VNode } from 'vue'
 import type { DateValue } from '@internationalized/date'
+import { getLocalTimeZone, today } from '@internationalized/date'
 import type { AppConfig } from '@nuxt/schema'
 import theme from '#build/ui/calendar'
 import type { ButtonProps, IconProps, LinkPropsKeys } from '../types'
@@ -10,6 +11,9 @@ import type { ComponentConfig } from '../types/tv'
 
 type Calendar = ComponentConfig<typeof theme, AppConfig, 'calendar'>
 
+export type CalendarType = 'date' | 'month' | 'year'
+export type CalendarView = 'day' | 'month' | 'year'
+
 type CalendarDefaultValue<R extends boolean = false, M extends boolean = false> = R extends true
   ? DateRange
   : M extends true
@@ -30,6 +34,18 @@ export interface CalendarProps<R extends boolean = false, M extends boolean = fa
    * @defaultValue 'div'
    */
   as?: any
+  /**
+   * The type of calendar picker.
+   * @defaultValue 'date'
+   */
+  type?: CalendarType
+  /** The controlled view state. Use with `@update:view` for controlled mode. */
+  view?: CalendarView
+  /**
+   * The default view when uncontrolled.
+   * @defaultValue Depends on `type` prop
+   */
+  defaultView?: CalendarView
   /**
    * The icon to use for the next year control.
    * @defaultValue appConfig.ui.icons.chevronDoubleRight
@@ -103,18 +119,72 @@ export interface CalendarProps<R extends boolean = false, M extends boolean = fa
 
 export interface CalendarEmits<R extends boolean = false, M extends boolean = false> extends Omit<CalendarRootEmits & RangeCalendarRootEmits, 'update:modelValue'> {
   'update:modelValue': [value: CalendarModelValue<R, M>]
+  'update:placeholder': [date: DateValue]
+  'update:view': [view: CalendarView]
 }
 
 export interface CalendarSlots {
-  'heading'?: (props: { value: string }) => VNode[]
-  'day'?: (props: Pick<CalendarCellTriggerProps, 'day'>) => VNode[]
-  'week-day'?: (props: { day: string }) => VNode[]
+  'heading'?(props: {
+    value: string
+    date: DateValue
+    view: CalendarView
+    setMonth: (date: DateValue) => void
+    setYear: (date: DateValue) => void
+    setView: (view: CalendarView) => void
+  }): VNode[]
+  'day'?(props: Pick<CalendarCellTriggerProps, 'day'>): VNode[]
+  'week-day'?(props: { day: string }): VNode[]
+  'month-cell'?(props: { month: DateValue, selected: boolean, disabled: boolean }): VNode[]
+  'year-cell'?(props: { year: DateValue, selected: boolean, disabled: boolean }): VNode[]
 }
 </script>
 
 <script setup lang="ts" generic="R extends boolean, M extends boolean">
-import { computed } from 'vue'
-import { useForwardPropsEmits } from 'reka-ui'
+import { computed, ref, shallowRef, watch } from 'vue'
+import {
+  MonthPickerRoot,
+  MonthPickerHeader,
+  MonthPickerHeading,
+  MonthPickerGrid,
+  MonthPickerGridBody,
+  MonthPickerGridRow,
+  MonthPickerCell,
+  MonthPickerCellTrigger,
+  MonthPickerPrev,
+  MonthPickerNext,
+  MonthRangePickerRoot,
+  MonthRangePickerHeader,
+  MonthRangePickerHeading,
+  MonthRangePickerGrid,
+  MonthRangePickerGridBody,
+  MonthRangePickerGridRow,
+  MonthRangePickerCell,
+  MonthRangePickerCellTrigger,
+  MonthRangePickerPrev,
+  MonthRangePickerNext,
+  YearPickerRoot,
+  YearPickerHeader,
+  YearPickerHeading,
+  YearPickerGrid,
+  YearPickerGridBody,
+  YearPickerGridRow,
+  YearPickerCell,
+  YearPickerCellTrigger,
+  YearPickerPrev,
+  YearPickerNext,
+  YearRangePickerRoot,
+  YearRangePickerHeader,
+  YearRangePickerHeading,
+  YearRangePickerGrid,
+  YearRangePickerGridBody,
+  YearRangePickerGridRow,
+  YearRangePickerCell,
+  YearRangePickerCellTrigger,
+  YearRangePickerPrev,
+  YearRangePickerNext,
+  useDateFormatter,
+  useForwardPropsEmits
+} from 'reka-ui'
 import { Calendar as SingleCalendar, RangeCalendar } from 'reka-ui/namespaced'
 import { reactiveOmit } from '@vueuse/core'
 import { useAppConfig } from '#imports'
@@ -124,6 +194,7 @@ import { tv } from '../utils/tv'
 import UButton from './Button.vue'
 
 const props = withDefaults(defineProps<CalendarProps<R, M>>(), {
+  type: 'date',
   fixedWeeks: true,
   monthControls: true,
   yearControls: true
@@ -131,16 +202,14 @@ const props = withDefaults(defineProps<CalendarProps<R, M>>(), {
 const emits = defineEmits<CalendarEmits<R, M>>()
 defineSlots<CalendarSlots>()
 
-const { dir, t, locale } = useLocale()
+const { dir, t, code } = useLocale()
 const appConfig = useAppConfig() as Calendar['AppConfig']
 const uiProp = useComponentUI('calendar', props)
+const formatter = shallowRef(useDateFormatter(code.value))
 
-const rootProps = useForwardPropsEmits(reactiveOmit(props, 'range', 'modelValue', 'defaultValue', 'color', 'variant', 'size', 'monthControls', 'yearControls', 'class', 'ui'), emits)
-
-const nextYearIcon = computed(() => props.nextYearIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronDoubleLeft : appConfig.ui.icons.chevronDoubleRight))
-const nextMonthIcon = computed(() => props.nextMonthIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronLeft : appConfig.ui.icons.chevronRight))
-const prevYearIcon = computed(() => props.prevYearIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronDoubleRight : appConfig.ui.icons.chevronDoubleLeft))
-const prevMonthIcon = computed(() => props.prevMonthIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronRight : appConfig.ui.icons.chevronLeft))
+watch(() => code.value, (value) => {
+  formatter.value = useDateFormatter(value)
+})
 
 const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.calendar || {}) })({
   color: props.color,
@@ -149,55 +218,348 @@ const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.calendar ||
   weekNumbers: props.weekNumbers
 }))
 
+function getDefaultView(type: CalendarType = props.type, defaultView = props.defaultView) {
+  if (defaultView) {
+    return defaultView
+  }
+
+  if (type === 'month') {
+    return 'month'
+  }
+
+  if (type === 'year') {
+    return 'year'
+  }
+
+  return 'day'
+}
+
+const internalView = ref<CalendarView>(getDefaultView())
+
+watch(() => [props.type, props.defaultView, props.view], ([type, defaultView, view]) => {
+  if (view === undefined) {
+    internalView.value = getDefaultView(type as CalendarType, defaultView as CalendarView | undefined)
+  }
+})
+
+const view = computed<CalendarView>({
+  get() {
+    if (props.type === 'month') {
+      return 'month'
+    }
+
+    if (props.type === 'year') {
+      return 'year'
+    }
+
+    return props.view ?? internalView.value
+  },
+  set(value) {
+    if (props.type !== 'date') {
+      return
+    }
+
+    internalView.value = value
+    emits('update:view', value)
+  }
+})
+
+function resolveDateValue(value: DateValue | DateValue[] | DateRange | null | undefined) {
+  if (Array.isArray(value)) {
+    return value[0]
+  }
+
+  if (!value) {
+    return
+  }
+
+  if (isDateRange(value)) {
+    return value.start ?? value.end ?? undefined
+  }
+
+  return value
+}
+
+function isDateRange(value: DateValue | DateRange) {
+  return 'start' in value || 'end' in value
+}
+
+const localPlaceholder = shallowRef<DateValue | undefined>(props.placeholder)
+
+watch(() => props.placeholder, (value) => {
+  localPlaceholder.value = value
+}, { immediate: true })
+
+const dayPlaceholder = computed(() => {
+  if (props.placeholder !== undefined || localPlaceholder.value !== undefined) {
+    return localPlaceholder.value
+  }
+
+  return undefined
+})
+
+const pickerPlaceholder = computed(() => {
+  return localPlaceholder.value
+    ?? resolveDateValue(props.modelValue as DateValue | DateValue[] | DateRange | null | undefined)
+    ?? resolveDateValue(props.defaultValue as DateValue | DateValue[] | DateRange | null | undefined)
+    ?? today(getLocalTimeZone())
+})
+
+function syncPlaceholder(value: DateValue) {
+  localPlaceholder.value = value
+}
+
+function updatePlaceholder(value: DateValue) {
+  syncPlaceholder(value)
+  emits('update:placeholder', value)
+}
+
+function setMonth(value: DateValue) {
+  updatePlaceholder(value)
+}
+
+function setYear(value: DateValue, base = pickerPlaceholder.value) {
+  updatePlaceholder(base.set({ year: value.year }))
+}
+
+function setView(value: CalendarView) {
+  view.value = value
+}
+
 function paginateYear(date: DateValue, sign: -1 | 1) {
-  if (sign === -1) {
-    return date.subtract({ years: 1 })
+  return sign === -1 ? date.subtract({ years: 1 }) : date.add({ years: 1 })
+}
+
+const dayRootProps = useForwardPropsEmits(
+  reactiveOmit(props, 'type', 'view', 'defaultView', 'range', 'modelValue', 'defaultValue', 'placeholder', 'color', 'variant', 'size', 'monthControls', 'yearControls', 'class', 'ui'),
+  emits
+)
+
+const calendarRootProps = computed(() => ({
+  ...dayRootProps.value,
+  'onUpdate:placeholder': updatePlaceholder
+}))
+
+const nextYearIcon = computed(() => props.nextYearIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronDoubleLeft : appConfig.ui.icons.chevronDoubleRight))
+const nextMonthIcon = computed(() => props.nextMonthIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronLeft : appConfig.ui.icons.chevronRight))
+const prevYearIcon = computed(() => props.prevYearIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronDoubleRight : appConfig.ui.icons.chevronDoubleLeft))
+const prevMonthIcon = computed(() => props.prevMonthIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronRight : appConfig.ui.icons.chevronLeft))
+
+const translateWithFallback = (key: string, fallback: string) => {
+  const label = t(key)
+  return label === key ? fallback : label
+}
+
+const prevMonthLabel = computed(() => translateWithFallback('calendar.prevMonth', 'Previous month'))
+const nextMonthLabel = computed(() => translateWithFallback('calendar.nextMonth', 'Next month'))
+const prevYearLabel = computed(() => translateWithFallback('calendar.prevYear', 'Previous year'))
+const nextYearLabel = computed(() => translateWithFallback('calendar.nextYear', 'Next year'))
+const prevDecadeLabel = computed(() => translateWithFallback('calendar.prevDecade', prevYearLabel.value))
+const nextDecadeLabel = computed(() => translateWithFallback('calendar.nextDecade', nextYearLabel.value))
+const switchToMonthsLabel = computed(() => translateWithFallback('calendar.switchToMonths', 'Switch to month view'))
+const switchToYearsLabel = computed(() => translateWithFallback('calendar.switchToYears', 'Switch to year view'))
+
+function formatMonthLabel(date: DateValue) {
+  try {
+    return formatter.value.custom(date.toDate(getLocalTimeZone()), { month: 'long' })
+  } catch {
+    return String(date.month)
   }
+}
+
+function formatYearLabel(date: DateValue) {
+  try {
+    return formatter.value.custom(date.toDate(getLocalTimeZone()), { year: 'numeric' })
+  } catch {
+    return String(date.year)
+  }
+}
+
+function getHeadingValue(date: DateValue, value: Extract<CalendarView, 'month' | 'year'>) {
+  return value === 'month' ? formatMonthLabel(date) : formatYearLabel(date)
+}
+
+function getHeadingLabel(date: DateValue, value: Extract<CalendarView, 'month' | 'year'>) {
+  const actionLabel = value === 'month' ? switchToMonthsLabel.value : switchToYearsLabel.value
+  return `${getHeadingValue(date, value)}, ${actionLabel}`
+}
+
+function getHeadingButtonClass(active: boolean) {
+  return [
+    'rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented',
+    active ? 'cursor-default' : 'cursor-pointer hover:bg-elevated/50'
+  ]
+}
 
-  return date.add({ years: 1 })
+function emitModelValue(value: DateValue | DateRange) {
+  emits('update:modelValue', value as CalendarModelValue<R, M>)
 }
 
-const Calendar = computed(() => props.range ? RangeCalendar : SingleCalendar)
+const DayCalendar = computed(() => props.range ? RangeCalendar : SingleCalendar)
+const isMonthView = computed(() => view.value === 'month')
+const isYearView = computed(() => view.value === 'year')
+const isNavigationMonthView = computed(() => props.type === 'date' && isMonthView.value)
+const isNavigationYearView = computed(() => props.type === 'date' && isYearView.value)
+const isStandalonePicker = computed(() => props.type !== 'date')
+const showMonthNavigation = computed(() => props.type === 'date' && view.value === 'day' && props.monthControls)
+
+function onMonthUpdate(value: DateValue | DateRange) {
+  if (isNavigationMonthView.value) {
+    const nextValue = resolveDateValue(value) ?? pickerPlaceholder.value
+    setMonth(nextValue)
+    setView('day')
+    return
+  }
+
+  emitModelValue(value)
+}
+
+function onYearUpdate(value: DateValue | DateRange) {
+  if (isNavigationYearView.value) {
+    const nextValue = resolveDateValue(value) ?? pickerPlaceholder.value
+    setYear(nextValue, pickerPlaceholder.value)
+    setView('month')
+    return
+  }
+
+  emitModelValue(value)
+}
+
+const monthPicker = computed(() => ({
+  kind: 'month' as const,
+  root: props.range ? MonthRangePickerRoot : MonthPickerRoot,
+  header: props.range ? MonthRangePickerHeader : MonthPickerHeader,
+  heading: props.range ? MonthRangePickerHeading : MonthPickerHeading,
+  grid: props.range ? MonthRangePickerGrid : MonthPickerGrid,
+  gridBody: props.range ? MonthRangePickerGridBody : MonthPickerGridBody,
+  gridRow: props.range ? MonthRangePickerGridRow : MonthPickerGridRow,
+  cell: props.range ? MonthRangePickerCell : MonthPickerCell,
+  cellTrigger: props.range ? MonthRangePickerCellTrigger : MonthPickerCellTrigger,
+  prev: props.range ? MonthRangePickerPrev : MonthPickerPrev,
+  next: props.range ? MonthRangePickerNext : MonthPickerNext,
+  slotName: 'month-cell',
+  gridSlot: 'monthGrid',
+  rowSlot: 'monthGridRow',
+  cellSlot: 'monthCell',
+  triggerSlot: 'monthCellTrigger',
+  itemProp: 'month',
+  labelProp: 'monthValue',
+  previousLabel: prevYearLabel.value,
+  nextLabel: nextYearLabel.value,
+  onUpdate: onMonthUpdate
+}) as const)
+
+const yearPicker = computed(() => ({
+  kind: 'year' as const,
+  root: props.range ? YearRangePickerRoot : YearPickerRoot,
+  header: props.range ? YearRangePickerHeader : YearPickerHeader,
+  heading: props.range ? YearRangePickerHeading : YearPickerHeading,
+  grid: props.range ? YearRangePickerGrid : YearPickerGrid,
+  gridBody: props.range ? YearRangePickerGridBody : YearPickerGridBody,
+  gridRow: props.range ? YearRangePickerGridRow : YearPickerGridRow,
+  cell: props.range ? YearRangePickerCell : YearPickerCell,
+  cellTrigger: props.range ? YearRangePickerCellTrigger : YearPickerCellTrigger,
+  prev: props.range ? YearRangePickerPrev : YearPickerPrev,
+  next: props.range ? YearRangePickerNext : YearPickerNext,
+  slotName: 'year-cell',
+  gridSlot: 'yearGrid',
+  rowSlot: 'yearGridRow',
+  cellSlot: 'yearCell',
+  triggerSlot: 'yearCellTrigger',
+  itemProp: 'year',
+  labelProp: 'yearValue',
+  previousLabel: prevDecadeLabel.value,
+  nextLabel: nextDecadeLabel.value,
+  onUpdate: onYearUpdate
+}) as const)
+
+const picker = computed<any>(() => isMonthView.value ? monthPicker.value : yearPicker.value)
+const pickerDefaultValue = computed(() => props.defaultValue as DateValue | DateRange | undefined)
+const pickerModelValue = computed(() => props.modelValue as DateValue | DateRange | undefined)
+const pickerValueProps = computed<Record<string, any>>(() => isStandalonePicker.value
+  ? {
+      modelValue: pickerModelValue.value,
+      defaultValue: pickerDefaultValue.value
+    }
+  : {})
+
+function onPickerPlaceholderUpdate(value: DateValue) {
+  if (isStandalonePicker.value) {
+    updatePlaceholder(value)
+    return
+  }
+
+  syncPlaceholder(value)
+}
 </script>
 
 <template>
-  <Calendar.Root
-    v-slot="{ weekDays, grid }"
-    v-bind="rootProps"
+  <DayCalendar.Root
+    v-if="view === 'day'"
+    v-slot="{ weekDays, grid, date }"
+    v-bind="calendarRootProps"
     :model-value="(modelValue as DateValue | DateValue[])"
     :default-value="(defaultValue as DateValue)"
+    :placeholder="dayPlaceholder"
+    :locale="code"
+    :dir="dir"
     data-slot="root"
     :class="ui.root({ class: [uiProp?.root, props.class] })"
   >
-    <Calendar.Header data-slot="header" :class="ui.header({ class: uiProp?.header })">
-      <Calendar.Prev v-if="props.yearControls" :prev-page="(date: DateValue) => paginateYear(date, -1)" :aria-label="t('calendar.prevYear')" as-child>
+    <DayCalendar.Header data-slot="header" :class="ui.header({ class: uiProp?.header })">
+      <DayCalendar.Prev v-if="props.yearControls" :prev-page="(value: DateValue) => paginateYear(value, -1)" :aria-label="prevYearLabel" as-child>
         <UButton :icon="prevYearIcon" :size="props.size" color="neutral" variant="ghost" v-bind="props.prevYear" />
-      </Calendar.Prev>
-      <Calendar.Prev v-if="props.monthControls" :aria-label="t('calendar.prevMonth')" as-child>
+      </DayCalendar.Prev>
+      <DayCalendar.Prev v-if="showMonthNavigation" :aria-label="prevMonthLabel" as-child>
         <UButton :icon="prevMonthIcon" :size="props.size" color="neutral" variant="ghost" v-bind="props.prevMonth" />
-      </Calendar.Prev>
-      <Calendar.Heading v-slot="{ headingValue }" data-slot="heading" :class="ui.heading({ class: uiProp?.heading })">
-        <slot name="heading" :value="headingValue">
-          {{ headingValue }}
+      </DayCalendar.Prev>
+      <DayCalendar.Heading v-slot="{ headingValue }" data-slot="heading" :class="ui.heading({ class: uiProp?.heading })">
+        <slot
+          name="heading"
+          :value="headingValue"
+          :date="date"
+          :view="view"
+          :set-month="setMonth"
+          :set-year="(value: DateValue) => setYear(value, date)"
+          :set-view="setView"
+        >
+          <div class="inline-flex items-center gap-1">
+            <button
+              type="button"
+              :class="getHeadingButtonClass(false)"
+              :aria-label="getHeadingLabel(date, 'month')"
+              @click="setView('month')"
+            >
+              {{ formatMonthLabel(date) }}
+            </button>
+            <button
+              type="button"
+              :class="getHeadingButtonClass(false)"
+              :aria-label="getHeadingLabel(date, 'year')"
+              @click="setView('year')"
+            >
+              {{ formatYearLabel(date) }}
+            </button>
+          </div>
         </slot>
-      </Calendar.Heading>
-      <Calendar.Next v-if="props.monthControls" :aria-label="t('calendar.nextMonth')" as-child>
+      </DayCalendar.Heading>
+      <DayCalendar.Next v-if="showMonthNavigation" :aria-label="nextMonthLabel" as-child>
         <UButton :icon="nextMonthIcon" :size="props.size" color="neutral" variant="ghost" v-bind="props.nextMonth" />
-      </Calendar.Next>
-      <Calendar.Next v-if="props.yearControls" :next-page="(date: DateValue) => paginateYear(date, 1)" :aria-label="t('calendar.nextYear')" as-child>
+      </DayCalendar.Next>
+      <DayCalendar.Next v-if="props.yearControls" :next-page="(value: DateValue) => paginateYear(value, 1)" :aria-label="nextYearLabel" as-child>
         <UButton :icon="nextYearIcon" :size="props.size" color="neutral" variant="ghost" v-bind="props.nextYear" />
-      </Calendar.Next>
-    </Calendar.Header>
+      </DayCalendar.Next>
+    </DayCalendar.Header>
     <div data-slot="body" :class="ui.body({ class: uiProp?.body })">
-      <Calendar.Grid
+      <DayCalendar.Grid
         v-for="month in grid"
         :key="month.value.toString()"
         data-slot="grid"
         :class="ui.grid({ class: uiProp?.grid })"
       >
-        <Calendar.GridHead>
-          <Calendar.GridRow data-slot="gridWeekDaysRow" :class="ui.gridWeekDaysRow({ class: uiProp?.gridWeekDaysRow })">
-            <Calendar.HeadCell
+        <DayCalendar.GridHead>
+          <DayCalendar.GridRow data-slot="gridWeekDaysRow" :class="ui.gridWeekDaysRow({ class: uiProp?.gridWeekDaysRow })">
+            <DayCalendar.HeadCell
               v-for="day in weekDays"
               :key="day"
               data-slot="headCell"
@@ -206,11 +568,11 @@ const Calendar = computed(() => props.range ? RangeCalendar : SingleCalendar)
               <slot name="week-day" :day="day">
                 {{ day }}
               </slot>
-            </Calendar.HeadCell>
-          </Calendar.GridRow>
-        </Calendar.GridHead>
-        <Calendar.GridBody data-slot="gridBody" :class="ui.gridBody({ class: uiProp?.gridBody })">
-          <Calendar.GridRow
+            </DayCalendar.HeadCell>
+          </DayCalendar.GridRow>
+        </DayCalendar.GridHead>
+        <DayCalendar.GridBody data-slot="gridBody" :class="ui.gridBody({ class: uiProp?.gridBody })">
+          <DayCalendar.GridRow
             v-for="(weekDates, index) in month.rows"
             :key="`weekDate-${index}`"
             data-slot="gridRow"
@@ -222,16 +584,16 @@ const Calendar = computed(() => props.range ? RangeCalendar : SingleCalendar)
               data-slot="cellWeek"
               :class="ui.cellWeek({ class: uiProp?.cellWeek })"
             >
-              {{ getWeekNumber(weekDates[0], locale.code) }}
+              {{ getWeekNumber(weekDates[0], code) }}
             </td>
-            <Calendar.Cell
+            <DayCalendar.Cell
               v-for="weekDate in weekDates"
               :key="weekDate.toString()"
               :date="weekDate"
               data-slot="cell"
               :class="ui.cell({ class: uiProp?.cell })"
             >
-              <Calendar.CellTrigger
+              <DayCalendar.CellTrigger
                 :day="weekDate"
                 :month="month.value"
                 data-slot="cellTrigger"
@@ -240,11 +602,133 @@ const Calendar = computed(() => props.range ? RangeCalendar : SingleCalendar)
                 <slot name="day" :day="weekDate">
                   {{ weekDate.day }}
                 </slot>
-              </Calendar.CellTrigger>
-            </Calendar.Cell>
-          </Calendar.GridRow>
-        </Calendar.GridBody>
-      </Calendar.Grid>
+              </DayCalendar.CellTrigger>
+            </DayCalendar.Cell>
+          </DayCalendar.GridRow>
+        </DayCalendar.GridBody>
+      </DayCalendar.Grid>
     </div>
-  </Calendar.Root>
+  </DayCalendar.Root>
+
+  <component
+    :is="picker.root"
+    v-else
+    v-slot="{ grid, date }"
+    v-bind="pickerValueProps"
+    :placeholder="pickerPlaceholder"
+    :locale="code"
+    :dir="dir"
+    :min-value="minValue"
+    :max-value="maxValue"
+    :disabled="disabled"
+    :readonly="readonly"
+    data-slot="root"
+    :class="ui.root({ class: ['inline-flex w-fit flex-col gap-4', uiProp?.root, props.class] })"
+    @update:model-value="picker.onUpdate"
+    @update:placeholder="onPickerPlaceholderUpdate"
+  >
+    <component
+      :is="picker.header"
+      data-slot="header"
+      :class="ui.header({ class: ['grid w-full grid-cols-[auto_1fr_1fr_auto] items-center gap-1', uiProp?.header] })"
+    >
+      <component :is="picker.prev" v-if="props.yearControls" :aria-label="picker.previousLabel" as-child>
+        <UButton :icon="prevYearIcon" :size="props.size" color="neutral" variant="ghost" v-bind="props.prevYear" />
+      </component>
+      <component
+        :is="picker.heading"
+        v-slot="{ headingValue }"
+        data-slot="heading"
+        :class="ui.heading({ class: ['col-span-2 overflow-visible whitespace-nowrap text-center', uiProp?.heading] })"
+      >
+        <slot
+          name="heading"
+          :value="headingValue"
+          :date="date"
+          :view="view"
+          :set-month="setMonth"
+          :set-year="(value: DateValue) => setYear(value, date)"
+          :set-view="setView"
+        >
+          <div v-if="props.type === 'date'" class="inline-flex items-center gap-1">
+            <button
+              type="button"
+              :class="getHeadingButtonClass(view === 'month')"
+              :aria-label="getHeadingLabel(date, 'month')"
+              :disabled="view === 'month'"
+              @click="setView('month')"
+            >
+              {{ formatMonthLabel(date) }}
+            </button>
+            <button
+              type="button"
+              :class="getHeadingButtonClass(view === 'year')"
+              :aria-label="getHeadingLabel(date, 'year')"
+              :disabled="view === 'year'"
+              @click="setView('year')"
+            >
+              {{ formatYearLabel(date) }}
+            </button>
+          </div>
+          <span v-else>
+            {{ headingValue }}
+          </span>
+        </slot>
+      </component>
+      <component :is="picker.next" v-if="props.yearControls" :aria-label="picker.nextLabel" as-child>
+        <UButton :icon="nextYearIcon" :size="props.size" color="neutral" variant="ghost" v-bind="props.nextYear" />
+      </component>
+    </component>
+
+    <component
+      :is="picker.grid"
+      as="div"
+      :data-slot="picker.gridSlot"
+      :class="picker.kind === 'month'
+        ? ui.monthGrid({ class: uiProp?.monthGrid })
+        : ui.yearGrid({ class: uiProp?.yearGrid })"
+    >
+      <component :is="picker.gridBody" as="div">
+        <component
+          :is="picker.gridRow"
+          v-for="(row, rowIndex) in grid.rows"
+          :key="rowIndex"
+          as="div"
+          :data-slot="picker.rowSlot"
+          :class="picker.kind === 'month'
+            ? ui.monthGridRow({ class: uiProp?.monthGridRow })
+            : ui.yearGridRow({ class: uiProp?.yearGridRow })"
+        >
+          <component
+            :is="picker.cell"
+            v-for="cellDate in row"
+            :key="cellDate.toString()"
+            as="div"
+            :date="cellDate"
+            :data-slot="picker.cellSlot"
+            :class="picker.kind === 'month'
+              ? ui.monthCell({ class: uiProp?.monthCell })
+              : ui.yearCell({ class: uiProp?.yearCell })"
+          >
+            <component
+              :is="picker.cellTrigger"
+              v-slot="slotProps"
+              v-bind="{ [picker.itemProp]: cellDate }"
+              :data-slot="picker.triggerSlot"
+              :class="picker.kind === 'month'
+                ? ui.monthCellTrigger({ class: uiProp?.monthCellTrigger })
+                : ui.yearCellTrigger({ class: uiProp?.yearCellTrigger })"
+            >
+              <slot v-if="picker.kind === 'month'" name="month-cell" :month="cellDate" :selected="slotProps.selected" :disabled="slotProps.disabled">
+                {{ slotProps.monthValue }}
+              </slot>
+              <slot v-else name="year-cell" :year="cellDate" :selected="slotProps.selected" :disabled="slotProps.disabled">
+                {{ slotProps.yearValue }}
+              </slot>
+            </component>
+          </component>
+        </component>
+      </component>
+    </component>
+  </component>
 </template>
diff --git a/src/theme/calendar.ts b/src/theme/calendar.ts
index 1339bb2527..a09ab88cfd 100644
--- a/src/theme/calendar.ts
+++ b/src/theme/calendar.ts
@@ -1,11 +1,39 @@
 import type { ModuleOptions } from '../module'
 
+type PickerTriggerVariant = 'solid' | 'outline' | 'soft' | 'subtle'
+
+function getPickerTriggerClass(color: string, variant: PickerTriggerVariant) {
+  switch (variant) {
+    case 'solid':
+      return `data-[selected]:bg-${color} data-[selected]:text-inverted data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+    case 'outline':
+      return `data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/50 data-[selected]:text-${color} data-[highlighted]:bg-${color}/10 hover:not-data-[selected]:bg-${color}/10`
+    case 'soft':
+      return `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+    case 'subtle':
+      return `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/25 data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+  }
+}
+
+function getNeutralPickerTriggerClass(variant: PickerTriggerVariant) {
+  switch (variant) {
+    case 'solid':
+      return 'data-[selected]:bg-inverted data-[selected]:text-inverted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
+    case 'outline':
+      return 'data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[selected]:text-default data-[selected]:bg-default data-[highlighted]:bg-inverted/10 hover:not-data-[selected]:bg-inverted/10'
+    case 'soft':
+      return 'data-[selected]:bg-elevated data-[selected]:text-default data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
+    case 'subtle':
+      return 'data-[selected]:bg-elevated data-[selected]:text-default data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
+  }
+}
+
 export default (options: Required<ModuleOptions>) => ({
   slots: {
     root: '',
     header: 'flex items-center justify-between',
     body: 'flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0',
-    heading: 'text-center font-medium truncate mx-auto',
+    heading: 'mx-auto text-center font-medium',
     grid: 'w-full border-collapse select-none space-y-1 focus:outline-none',
     gridRow: 'grid grid-cols-7 place-items-center',
     gridWeekDaysRow: 'mb-1 grid w-full grid-cols-7',
@@ -14,17 +42,29 @@ export default (options: Required<ModuleOptions>) => ({
     headCellWeek: 'rounded-md text-muted',
     cell: 'relative text-center',
     cellTrigger: ['m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted', options.theme.transitions && 'transition'],
-    cellWeek: 'relative text-center text-muted'
+    cellWeek: 'relative text-center text-muted',
+    monthGrid: 'w-full select-none space-y-1 focus:outline-none',
+    monthGridRow: 'grid grid-cols-4 gap-1',
+    monthCell: 'relative text-center',
+    monthCellTrigger: ['relative flex w-full items-center justify-center rounded-md whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted', options.theme.transitions && 'transition'],
+    yearGrid: 'w-full select-none space-y-1 focus:outline-none',
+    yearGridRow: 'grid grid-cols-4 gap-1',
+    yearCell: 'relative text-center',
+    yearCellTrigger: ['relative flex w-full items-center justify-center rounded-md whitespace-nowrap tabular-nums focus-visible:ring-2 focus:outline-none data-disabled:text-muted', options.theme.transitions && 'transition']
   },
   variants: {
     color: {
       ...Object.fromEntries((options.theme.colors || []).map((color: string) => [color, {
         headCell: `text-${color}`,
-        cellTrigger: `focus-visible:ring-${color}`
+        cellTrigger: `focus-visible:ring-${color}`,
+        monthCellTrigger: `focus-visible:ring-${color}`,
+        yearCellTrigger: `focus-visible:ring-${color}`
       }])),
       neutral: {
         headCell: 'text-highlighted',
-        cellTrigger: 'focus-visible:ring-inverted'
+        cellTrigger: 'focus-visible:ring-inverted',
+        monthCellTrigger: 'focus-visible:ring-inverted',
+        yearCellTrigger: 'focus-visible:ring-inverted'
       }
     },
     variant: {
@@ -41,7 +81,9 @@ export default (options: Required<ModuleOptions>) => ({
         headCell: 'text-[10px]',
         headCellWeek: 'text-[10px]',
         cellTrigger: 'size-7',
-        body: 'space-y-2 pt-2'
+        body: 'space-y-2 pt-2',
+        monthCellTrigger: 'h-7 px-2 text-xs',
+        yearCellTrigger: 'h-7 px-2 text-xs'
       },
       sm: {
         heading: 'text-xs',
@@ -49,7 +91,9 @@ export default (options: Required<ModuleOptions>) => ({
         headCellWeek: 'text-xs',
         cellWeek: 'text-xs',
         cell: 'text-xs',
-        cellTrigger: 'size-7'
+        cellTrigger: 'size-7',
+        monthCellTrigger: 'h-7 px-2 text-xs',
+        yearCellTrigger: 'h-7 px-2 text-xs'
       },
       md: {
         heading: 'text-sm',
@@ -57,19 +101,25 @@ export default (options: Required<ModuleOptions>) => ({
         headCellWeek: 'text-xs',
         cellWeek: 'text-xs',
         cell: 'text-sm',
-        cellTrigger: 'size-8'
+        cellTrigger: 'size-8',
+        monthCellTrigger: 'h-8 px-3 text-sm',
+        yearCellTrigger: 'h-8 px-3 text-sm'
       },
       lg: {
         heading: 'text-md',
         headCell: 'text-md',
         headCellWeek: 'text-md',
-        cellTrigger: 'size-9 text-md'
+        cellTrigger: 'size-9 text-md',
+        monthCellTrigger: 'h-9 px-4 text-md',
+        yearCellTrigger: 'h-9 px-4 text-md'
       },
       xl: {
         heading: 'text-lg',
         headCell: 'text-lg',
         headCellWeek: 'text-lg',
-        cellTrigger: 'size-10 text-lg'
+        cellTrigger: 'size-10 text-lg',
+        monthCellTrigger: 'h-10 px-5 text-lg',
+        yearCellTrigger: 'h-10 px-5 text-lg'
       }
     },
     weekNumbers: {
@@ -79,55 +129,80 @@ export default (options: Required<ModuleOptions>) => ({
       }
     }
   },
-  compoundVariants: [...(options.theme.colors || []).map((color: string) => ({
-    color,
-    variant: 'solid',
-    class: {
-      cellTrigger: `data-[selected]:bg-${color} data-[selected]:text-inverted data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
-    }
-  })), ...(options.theme.colors || []).map((color: string) => ({
-    color,
-    variant: 'outline',
-    class: {
-      cellTrigger: `data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/50 data-[selected]:text-${color} data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/10 hover:not-data-[selected]:bg-${color}/10`
-    }
-  })), ...(options.theme.colors || []).map((color: string) => ({
-    color,
-    variant: 'soft',
-    class: {
-      cellTrigger: `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
-    }
-  })), ...(options.theme.colors || []).map((color: string) => ({
-    color,
-    variant: 'subtle',
-    class: {
-      cellTrigger: `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/25 data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
-    }
-  })), {
-    color: 'neutral',
-    variant: 'solid',
-    class: {
-      cellTrigger: 'data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
-    }
-  }, {
-    color: 'neutral',
-    variant: 'outline',
-    class: {
-      cellTrigger: 'data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[selected]:text-default data-[selected]:bg-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/10 hover:not-data-[selected]:bg-inverted/10'
-    }
-  }, {
-    color: 'neutral',
-    variant: 'soft',
-    class: {
-      cellTrigger: 'data-[selected]:bg-elevated data-[selected]:text-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
-    }
-  }, {
-    color: 'neutral',
-    variant: 'subtle',
-    class: {
-      cellTrigger: 'data-[selected]:bg-elevated data-[selected]:text-default data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
+  compoundVariants: [
+    ...(options.theme.colors || []).map((color: string) => ({
+      color,
+      variant: 'solid',
+      class: {
+        cellTrigger: `data-[selected]:bg-${color} data-[selected]:text-inverted data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+      }
+    })),
+    ...(options.theme.colors || []).map((color: string) => ({
+      color,
+      variant: 'outline',
+      class: {
+        cellTrigger: `data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/50 data-[selected]:text-${color} data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/10 hover:not-data-[selected]:bg-${color}/10`
+      }
+    })),
+    ...(options.theme.colors || []).map((color: string) => ({
+      color,
+      variant: 'soft',
+      class: {
+        cellTrigger: `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+      }
+    })),
+    ...(options.theme.colors || []).map((color: string) => ({
+      color,
+      variant: 'subtle',
+      class: {
+        cellTrigger: `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/25 data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+      }
+    })),
+    ...(options.theme.colors || []).flatMap((color: string) => (['solid', 'outline', 'soft', 'subtle'] as PickerTriggerVariant[]).map(variant => ({
+      color,
+      variant,
+      class: {
+        monthCellTrigger: getPickerTriggerClass(color, variant),
+        yearCellTrigger: getPickerTriggerClass(color, variant)
+      }
+    }))),
+    {
+      color: 'neutral',
+      variant: 'solid',
+      class: {
+        cellTrigger: 'data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10',
+        monthCellTrigger: getNeutralPickerTriggerClass('solid'),
+        yearCellTrigger: getNeutralPickerTriggerClass('solid')
+      }
+    },
+    {
+      color: 'neutral',
+      variant: 'outline',
+      class: {
+        cellTrigger: 'data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[selected]:text-default data-[selected]:bg-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/10 hover:not-data-[selected]:bg-inverted/10',
+        monthCellTrigger: getNeutralPickerTriggerClass('outline'),
+        yearCellTrigger: getNeutralPickerTriggerClass('outline')
+      }
+    },
+    {
+      color: 'neutral',
+      variant: 'soft',
+      class: {
+        cellTrigger: 'data-[selected]:bg-elevated data-[selected]:text-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10',
+        monthCellTrigger: getNeutralPickerTriggerClass('soft'),
+        yearCellTrigger: getNeutralPickerTriggerClass('soft')
+      }
+    },
+    {
+      color: 'neutral',
+      variant: 'subtle',
+      class: {
+        cellTrigger: 'data-[selected]:bg-elevated data-[selected]:text-default data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10',
+        monthCellTrigger: getNeutralPickerTriggerClass('subtle'),
+        yearCellTrigger: getNeutralPickerTriggerClass('subtle')
+      }
     }
-  }],
+  ],
   defaultVariants: {
     size: 'md',
     color: 'primary',
diff --git a/test/components/Calendar.spec.ts b/test/components/Calendar.spec.ts
index 4862b06030..c1f2d34321 100644
--- a/test/components/Calendar.spec.ts
+++ b/test/components/Calendar.spec.ts
@@ -1,10 +1,19 @@
-import { describe, it, expect, vi, afterAll, test } from 'vitest'
+import { afterAll, describe, expect, it, test, vi } from 'vitest'
 import { axe } from 'vitest-axe'
 import { mountSuspended } from '@nuxt/test-utils/runtime'
 import { CalendarDate } from '@internationalized/date'
-import { renderEach } from '../component-render'
+import { ref } from 'vue'
+import type { Locale } from '../../src/runtime/types/locale'
 import Calendar from '../../src/runtime/components/Calendar.vue'
+import type { CalendarSlots } from '../../src/runtime/components/Calendar.vue'
+import { renderEach } from '../component-render'
 import theme from '#build/ui/calendar'
+import en from '../../src/runtime/locale/en'
+import fr from '../../src/runtime/locale/fr'
+
+type HeadingSlotProps = Parameters<NonNullable<CalendarSlots['heading']>>[0]
+type MonthCellSlotProps = Parameters<NonNullable<CalendarSlots['month-cell']>>[0]
+type YearCellSlotProps = Parameters<NonNullable<CalendarSlots['year-cell']>>[0]
 
 describe('Calendar', () => {
   const sizes = Object.keys(theme.variants.size) as any
@@ -18,7 +27,6 @@ describe('Calendar', () => {
   })
 
   renderEach(Calendar, [
-    // Props
     ['with modelValue', { props: { modelValue: new CalendarDate(2025, 1, 1) } }],
     ['with default value', { props: { defaultValue: new CalendarDate(2025, 1, 1) } }],
     ['with range', { props: { range: true } }],
@@ -46,7 +54,6 @@ describe('Calendar', () => {
     ['with as', { props: { as: 'section' } }],
     ['with class', { props: { class: 'max-w-sm' } }],
     ['with ui', { props: { ui: { header: 'gap-4' } } }],
-    // Slots
     ['with heading slot', { slots: { heading: () => 'Heading' } }],
     ['with day slot', { slots: { day: ({ day }) => day.day } }],
     ['with week-day slot', { slots: { 'week-day': ({ day }) => day } }]
@@ -55,18 +62,18 @@ describe('Calendar', () => {
   describe('emits', () => {
     test('update:modelValue event', async () => {
       const wrapper = await mountSuspended(Calendar)
-      const date = new CalendarDate(2025, 1, 1)
+      const value = new CalendarDate(2025, 1, 1)
 
-      await wrapper.setValue(date)
-      expect(wrapper.emitted()).toMatchObject({ 'update:modelValue': [[date]] })
+      await wrapper.setValue(value)
+      expect(wrapper.emitted()).toMatchObject({ 'update:modelValue': [[value]] })
     })
 
     test('update:modelValue event range', async () => {
       const wrapper = await mountSuspended(Calendar, { props: { range: true } })
-      const date = { start: new CalendarDate(2025, 1, 1), end: new CalendarDate(2025, 1, 2) }
+      const value = { start: new CalendarDate(2025, 1, 1), end: new CalendarDate(2025, 1, 2) }
 
-      await wrapper.setValue(date)
-      expect(wrapper.emitted()).toMatchObject({ 'update:modelValue': [[date]] })
+      await wrapper.setValue(value)
+      expect(wrapper.emitted()).toMatchObject({ 'update:modelValue': [[value]] })
     })
   })
 
@@ -82,4 +89,253 @@ describe('Calendar', () => {
 
     expect(await axe(wrapper.element)).toHaveNoViolations()
   })
+
+  describe('type prop', () => {
+    test('type="month" emits update:modelValue on month select', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: {
+          type: 'month',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+
+      const monthButtons = wrapper.findAll('[data-slot="monthCellTrigger"]')
+      expect(monthButtons).toHaveLength(12)
+
+      await monthButtons[5]!.trigger('click')
+
+      const emitted = wrapper.emitted('update:modelValue')
+      expect(emitted?.[0]?.[0]).toMatchObject({ month: 6 })
+    })
+
+    test('type="year" emits update:modelValue on year select', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: {
+          type: 'year',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+
+      const yearButtons = wrapper.findAll('[data-slot="yearCellTrigger"]')
+      expect(yearButtons).toHaveLength(12)
+
+      await yearButtons[0]!.trigger('click')
+
+      const emitted = wrapper.emitted('update:modelValue')
+      expect(emitted?.[0]?.[0]).toMatchObject({ year: 2020 })
+    })
+
+    test('placeholder falls back to modelValue before today for month and year pickers', async () => {
+      let monthDate: CalendarDate | null = null
+      let yearDate: CalendarDate | null = null
+
+      await mountSuspended(Calendar, {
+        props: {
+          type: 'month',
+          modelValue: new CalendarDate(2023, 7, 1)
+        },
+        slots: {
+          heading: ({ date }: HeadingSlotProps) => {
+            monthDate = date as CalendarDate
+            return 'heading'
+          }
+        }
+      })
+
+      await mountSuspended(Calendar, {
+        props: {
+          type: 'year',
+          defaultValue: new CalendarDate(2032, 1, 1)
+        },
+        slots: {
+          heading: ({ date }: HeadingSlotProps) => {
+            yearDate = date as CalendarDate
+            return 'heading'
+          }
+        }
+      })
+
+      expect(monthDate).toMatchObject({ year: 2023, month: 7 })
+      expect(yearDate).toMatchObject({ year: 2032 })
+    })
+
+    test('month-cell and year-cell slots receive picker data', async () => {
+      const monthWrapper = await mountSuspended(Calendar, {
+        props: { type: 'month', defaultValue: new CalendarDate(2025, 1, 1) },
+        slots: {
+          'month-cell': ({ month }: MonthCellSlotProps) => `M${month.month}`
+        }
+      })
+
+      const yearWrapper = await mountSuspended(Calendar, {
+        props: { type: 'year', defaultValue: new CalendarDate(2025, 1, 1) },
+        slots: {
+          'year-cell': ({ year }: YearCellSlotProps) => `Y${year.year}`
+        }
+      })
+
+      expect(monthWrapper.text()).toContain('M1')
+      expect(yearWrapper.text()).toContain('Y2020')
+    })
+  })
+
+  describe('view switching', () => {
+    test('defaultView renders month and year panels', async () => {
+      const monthWrapper = await mountSuspended(Calendar, {
+        props: {
+          defaultView: 'month',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+      const yearWrapper = await mountSuspended(Calendar, {
+        props: {
+          defaultView: 'year',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+
+      expect(monthWrapper.find('[data-slot="monthGrid"]').exists()).toBe(true)
+      expect(monthWrapper.find('[data-slot="grid"]').exists()).toBe(false)
+      expect(yearWrapper.find('[data-slot="yearGrid"]').exists()).toBe(true)
+      expect(yearWrapper.find('[data-slot="grid"]').exists()).toBe(false)
+    })
+
+    test('clicking the heading switches day -> month -> year', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: { defaultValue: new CalendarDate(2025, 1, 1) }
+      })
+
+      expect(wrapper.find('[data-slot="grid"]').exists()).toBe(true)
+
+      const dayButtons = wrapper.findAll('[data-slot="heading"] button')
+      await dayButtons[0]!.trigger('click')
+
+      expect(wrapper.find('[data-slot="monthGrid"]').exists()).toBe(true)
+
+      const monthButtons = wrapper.findAll('[data-slot="heading"] button')
+      await monthButtons[1]!.trigger('click')
+
+      expect(wrapper.find('[data-slot="yearGrid"]').exists()).toBe(true)
+    })
+
+    test('selecting a month returns to day view and emits update:placeholder once', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: {
+          defaultView: 'month',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+
+      const monthButtons = wrapper.findAll('[data-slot="monthCellTrigger"]')
+      await monthButtons[5]!.trigger('click')
+
+      expect(wrapper.find('[data-slot="grid"]').exists()).toBe(true)
+
+      const placeholderEvents = wrapper.emitted('update:placeholder') ?? []
+      expect(placeholderEvents).toHaveLength(1)
+      expect(placeholderEvents[0]?.[0]).toMatchObject({ month: 6 })
+    })
+
+    test('selecting a year returns to month view and emits update:placeholder once', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: {
+          defaultView: 'year',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+
+      const yearButtons = wrapper.findAll('[data-slot="yearCellTrigger"]')
+      await yearButtons[0]!.trigger('click')
+
+      expect(wrapper.find('[data-slot="monthGrid"]').exists()).toBe(true)
+
+      const placeholderEvents = wrapper.emitted('update:placeholder') ?? []
+      expect(placeholderEvents).toHaveLength(1)
+      expect(placeholderEvents[0]?.[0]).toMatchObject({ year: 2020, month: 1 })
+    })
+
+    test('day month navigation emits update:placeholder once per action', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: {
+          defaultValue: new CalendarDate(2025, 1, 1),
+          yearControls: false
+        }
+      })
+
+      await wrapper.find('[aria-label="Next month"]').trigger('click')
+
+      const placeholderEvents = wrapper.emitted('update:placeholder') ?? []
+      expect(placeholderEvents).toHaveLength(1)
+    })
+
+    test('emits update:view while switching views', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: { defaultValue: new CalendarDate(2025, 1, 1) }
+      })
+
+      const headingButtons = wrapper.findAll('[data-slot="heading"] button')
+      await headingButtons[0]!.trigger('click')
+
+      expect(wrapper.emitted('update:view')?.[0]).toEqual(['month'])
+    })
+
+    test('type="month" keeps the standalone picker heading static', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: {
+          type: 'month',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+
+      expect(wrapper.find('[data-slot="monthGrid"]').exists()).toBe(true)
+      expect(wrapper.find('[data-slot="heading"] button').exists()).toBe(false)
+    })
+  })
+
+  describe('labels', () => {
+    test('uses fallback text for switch aria labels when locale keys are missing', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: { defaultValue: new CalendarDate(2025, 1, 1) }
+      })
+
+      const headingButtons = wrapper.findAll('[data-slot="heading"] button')
+      expect(headingButtons[0]!.attributes('aria-label')).toContain('Switch to month view')
+      expect(headingButtons[1]!.attributes('aria-label')).toContain('Switch to year view')
+    })
+
+    test('updates formatter output when locale changes', async () => {
+      vi.resetModules()
+
+      const { default: AppComponent } = await import('../../src/runtime/components/App.vue')
+      const { default: CalendarComponent } = await import('../../src/runtime/components/Calendar.vue')
+      const locale = ref<Locale<any>>(en)
+      const wrapper = await mountSuspended({
+        components: {
+          UApp: AppComponent,
+          UCalendar: CalendarComponent
+        },
+        setup() {
+          return {
+            locale,
+            CalendarDate
+          }
+        },
+        template: `
+          <UApp :locale="locale">
+            <UCalendar :default-value="new CalendarDate(2025, 1, 1)" />
+          </UApp>
+        `
+      })
+
+      const getMonthLabel = () => wrapper.findAll('[data-slot="heading"] button')[0]!.text()
+
+      expect(getMonthLabel()).toBe('January')
+
+      locale.value = fr as Locale<any>
+      await wrapper.vm.$nextTick()
+      await wrapper.vm.$nextTick()
+
+      expect(getMonthLabel().toLowerCase()).toBe('janvier')
+    })
+  })
 })
diff --git a/test/components/__snapshots__/Calendar-vue.spec.ts.snap b/test/components/__snapshots__/Calendar-vue.spec.ts.snap
index ca7a505267..ae32b105bc 100644
--- a/test/components/__snapshots__/Calendar-vue.spec.ts.snap
+++ b/test/components/__snapshots__/Calendar-vue.spec.ts.snap
@@ -9,7 +9,9 @@ exports[`Calendar > renders with as correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -193,7 +195,9 @@ exports[`Calendar > renders with class correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -377,7 +381,9 @@ exports[`Calendar > renders with color neutral correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -561,7 +567,9 @@ exports[`Calendar > renders with day slot correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -745,7 +753,9 @@ exports[`Calendar > renders with default value correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -929,7 +939,9 @@ exports[`Calendar > renders with disabled correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-disabled="" data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" disabled="" aria-label="Next month" aria-disabled="true" data-disabled="true" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-disabled="" data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" disabled="" aria-label="Next month" aria-disabled="true" data-disabled="true" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" disabled="" aria-label="Next year" aria-disabled="true" data-disabled="true" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -1113,7 +1125,7 @@ exports[`Calendar > renders with heading slot correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">Heading</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">Heading</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -1297,7 +1309,9 @@ exports[`Calendar > renders with isDateDisabled correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -1481,7 +1495,9 @@ exports[`Calendar > renders with isDateUnavailable correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -1665,7 +1681,9 @@ exports[`Calendar > renders with modelValue correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -1849,7 +1867,9 @@ exports[`Calendar > renders with multiple correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -2033,7 +2053,9 @@ exports[`Calendar > renders with nextMonth correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-primary hover:bg-primary/10 active:bg-primary/10 focus:outline-none focus-visible:bg-primary/10 disabled:bg-transparent aria-disabled:bg-transparent dark:disabled:bg-transparent dark:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-primary hover:bg-primary/10 active:bg-primary/10 focus:outline-none focus-visible:bg-primary/10 disabled:bg-transparent aria-disabled:bg-transparent dark:disabled:bg-transparent dark:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -2217,7 +2239,9 @@ exports[`Calendar > renders with nextYear correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-primary hover:bg-primary/10 active:bg-primary/10 focus:outline-none focus-visible:bg-primary/10 disabled:bg-transparent aria-disabled:bg-transparent dark:disabled:bg-transparent dark:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -2401,7 +2425,9 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January - February 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -2744,7 +2770,9 @@ exports[`Calendar > renders with prevMonth correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -2928,7 +2956,9 @@ exports[`Calendar > renders with prevYear correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -3483,7 +3513,9 @@ exports[`Calendar > renders with range correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -3664,7 +3696,9 @@ exports[`Calendar > renders with readonly correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -3848,7 +3882,9 @@ exports[`Calendar > renders with size lg correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-md">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-md">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -4032,7 +4068,9 @@ exports[`Calendar > renders with size md correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -4216,7 +4254,9 @@ exports[`Calendar > renders with size sm correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-xs">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-4"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-xs">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-4"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-4"></svg>
@@ -4400,7 +4440,9 @@ exports[`Calendar > renders with size xl correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-lg">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-base gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-6"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-lg">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-base gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-6"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-base gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-6"></svg>
@@ -4584,7 +4626,9 @@ exports[`Calendar > renders with size xs correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-xs">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-4"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-xs">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-4"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-4"></svg>
@@ -4768,7 +4812,9 @@ exports[`Calendar > renders with ui correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -4952,7 +4998,9 @@ exports[`Calendar > renders with variant outline correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -5136,7 +5184,9 @@ exports[`Calendar > renders with variant soft correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -5320,7 +5370,9 @@ exports[`Calendar > renders with variant solid correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -5504,7 +5556,9 @@ exports[`Calendar > renders with variant subtle correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -5688,7 +5742,9 @@ exports[`Calendar > renders with week-day slot correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -5872,7 +5928,9 @@ exports[`Calendar > renders with weekNumbers correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -6056,7 +6114,9 @@ exports[`Calendar > renders with weekStartsOn correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -6240,7 +6300,9 @@ exports[`Calendar > renders with weekdayFormat correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -6424,7 +6486,9 @@ exports[`Calendar > renders without fixedWeeks correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -6582,7 +6646,9 @@ exports[`Calendar > renders without monthControls correctly 1`] = `
       <!--v-if-->
     </button>
     <!--v-if-->
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div>
     <!--v-if--><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
@@ -6762,7 +6828,9 @@ exports[`Calendar > renders without yearControls correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button>
diff --git a/test/components/__snapshots__/Calendar.spec.ts.snap b/test/components/__snapshots__/Calendar.spec.ts.snap
index 61ad59cc42..6f51a54ee0 100644
--- a/test/components/__snapshots__/Calendar.spec.ts.snap
+++ b/test/components/__snapshots__/Calendar.spec.ts.snap
@@ -9,7 +9,9 @@ exports[`Calendar > renders with as correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -193,7 +195,9 @@ exports[`Calendar > renders with class correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -377,7 +381,9 @@ exports[`Calendar > renders with color neutral correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -561,7 +567,9 @@ exports[`Calendar > renders with day slot correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -745,7 +753,9 @@ exports[`Calendar > renders with default value correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -929,7 +939,9 @@ exports[`Calendar > renders with disabled correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-disabled="" data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" disabled="" aria-label="Next month" aria-disabled="true" data-disabled="true" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-disabled="" data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" disabled="" aria-label="Next month" aria-disabled="true" data-disabled="true" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" disabled="" aria-label="Next year" aria-disabled="true" data-disabled="true" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -1113,7 +1125,7 @@ exports[`Calendar > renders with heading slot correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">Heading</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">Heading</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -1297,7 +1309,9 @@ exports[`Calendar > renders with isDateDisabled correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -1481,7 +1495,9 @@ exports[`Calendar > renders with isDateUnavailable correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -1665,7 +1681,9 @@ exports[`Calendar > renders with modelValue correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -1849,7 +1867,9 @@ exports[`Calendar > renders with multiple correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -2033,7 +2053,9 @@ exports[`Calendar > renders with nextMonth correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-primary hover:bg-primary/10 active:bg-primary/10 focus:outline-none focus-visible:bg-primary/10 disabled:bg-transparent aria-disabled:bg-transparent dark:disabled:bg-transparent dark:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-primary hover:bg-primary/10 active:bg-primary/10 focus:outline-none focus-visible:bg-primary/10 disabled:bg-transparent aria-disabled:bg-transparent dark:disabled:bg-transparent dark:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -2217,7 +2239,9 @@ exports[`Calendar > renders with nextYear correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-primary hover:bg-primary/10 active:bg-primary/10 focus:outline-none focus-visible:bg-primary/10 disabled:bg-transparent aria-disabled:bg-transparent dark:disabled:bg-transparent dark:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -2401,7 +2425,9 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January - February 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -2744,7 +2770,9 @@ exports[`Calendar > renders with prevMonth correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -2928,7 +2956,9 @@ exports[`Calendar > renders with prevYear correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -3483,7 +3513,9 @@ exports[`Calendar > renders with range correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -3664,7 +3696,9 @@ exports[`Calendar > renders with readonly correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -3848,7 +3882,9 @@ exports[`Calendar > renders with size lg correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-md">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-md">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -4032,7 +4068,9 @@ exports[`Calendar > renders with size md correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -4216,7 +4254,9 @@ exports[`Calendar > renders with size sm correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-xs">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-4" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-xs">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-4" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-4" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -4400,7 +4440,9 @@ exports[`Calendar > renders with size xl correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-lg">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-base gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevron-right shrink-0 size-6" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-lg">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-base gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevron-right shrink-0 size-6" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-base gap-2 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-2"><span class="iconify i-lucide:chevrons-right shrink-0 size-6" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -4584,7 +4626,9 @@ exports[`Calendar > renders with size xs correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-xs">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1"><span class="iconify i-lucide:chevron-right shrink-0 size-4" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-xs">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1"><span class="iconify i-lucide:chevron-right shrink-0 size-4" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-xs gap-1 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1"><span class="iconify i-lucide:chevrons-right shrink-0 size-4" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -4768,7 +4812,9 @@ exports[`Calendar > renders with ui correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -4952,7 +4998,9 @@ exports[`Calendar > renders with variant outline correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -5136,7 +5184,9 @@ exports[`Calendar > renders with variant soft correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -5320,7 +5370,9 @@ exports[`Calendar > renders with variant solid correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -5504,7 +5556,9 @@ exports[`Calendar > renders with variant subtle correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -5688,7 +5742,9 @@ exports[`Calendar > renders with week-day slot correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -5872,7 +5928,9 @@ exports[`Calendar > renders with weekNumbers correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -6056,7 +6114,9 @@ exports[`Calendar > renders with weekStartsOn correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -6240,7 +6300,9 @@ exports[`Calendar > renders with weekdayFormat correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -6424,7 +6486,9 @@ exports[`Calendar > renders without fixedWeeks correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -6582,7 +6646,9 @@ exports[`Calendar > renders without monthControls correctly 1`] = `
       <!--v-if-->
     </button>
     <!--v-if-->
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div>
     <!--v-if--><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
@@ -6762,7 +6828,9 @@ exports[`Calendar > renders without yearControls correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button>

From 0f082e990efaf8ccd3b3532b964708413bc70dba Mon Sep 17 00:00:00 2001
From: onmax <maximogarciamtnez@gmail.com>
Date: Fri, 6 Mar 2026 14:31:21 +0100
Subject: [PATCH 2/6] fix(calendar): update formatter locale in place

---
 src/runtime/components/Calendar.vue | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/runtime/components/Calendar.vue b/src/runtime/components/Calendar.vue
index 368a599913..62b8a03212 100644
--- a/src/runtime/components/Calendar.vue
+++ b/src/runtime/components/Calendar.vue
@@ -208,7 +208,9 @@ const uiProp = useComponentUI('calendar', props)
 const formatter = shallowRef(useDateFormatter(code.value))
 
 watch(() => code.value, (value) => {
-  formatter.value = useDateFormatter(value)
+  if (formatter.value.getLocale() !== value) {
+    formatter.value.setLocale(value)
+  }
 })
 
 const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.calendar || {}) })({
@@ -360,6 +362,8 @@ const switchToMonthsLabel = computed(() => translateWithFallback('calendar.switc
 const switchToYearsLabel = computed(() => translateWithFallback('calendar.switchToYears', 'Switch to year view'))
 
 function formatMonthLabel(date: DateValue) {
+  code.value
+
   try {
     return formatter.value.custom(date.toDate(getLocalTimeZone()), { month: 'long' })
   } catch {
@@ -368,6 +372,8 @@ function formatMonthLabel(date: DateValue) {
 }
 
 function formatYearLabel(date: DateValue) {
+  code.value
+
   try {
     return formatter.value.custom(date.toDate(getLocalTimeZone()), { year: 'numeric' })
   } catch {

From 1c7f1eeda143ca96f46698d58a1dfb434d229bd3 Mon Sep 17 00:00:00 2001
From: onmax <maximogarciamtnez@gmail.com>
Date: Fri, 6 Mar 2026 20:35:15 +0100
Subject: [PATCH 3/6] fix(Calendar): preserve picker root props and view state

---
 src/runtime/components/Calendar.vue | 35 +++++++++++++++--------------
 test/components/Calendar.spec.ts    | 29 ++++++++++++++++++++++++
 2 files changed, 47 insertions(+), 17 deletions(-)

diff --git a/src/runtime/components/Calendar.vue b/src/runtime/components/Calendar.vue
index 62b8a03212..c5cf7d0187 100644
--- a/src/runtime/components/Calendar.vue
+++ b/src/runtime/components/Calendar.vue
@@ -238,9 +238,14 @@ function getDefaultView(type: CalendarType = props.type, defaultView = props.def
 
 const internalView = ref<CalendarView>(getDefaultView())
 
-watch(() => [props.type, props.defaultView, props.view], ([type, defaultView, view]) => {
-  if (view === undefined) {
-    internalView.value = getDefaultView(type as CalendarType, defaultView as CalendarView | undefined)
+watch(() => [props.type, props.view] as const, ([type, view], [previousType]) => {
+  if (view !== undefined) {
+    internalView.value = view
+    return
+  }
+
+  if (type !== previousType) {
+    internalView.value = getDefaultView(type as CalendarType, props.defaultView)
   }
 })
 
@@ -362,8 +367,6 @@ const switchToMonthsLabel = computed(() => translateWithFallback('calendar.switc
 const switchToYearsLabel = computed(() => translateWithFallback('calendar.switchToYears', 'Switch to year view'))
 
 function formatMonthLabel(date: DateValue) {
-  code.value
-
   try {
     return formatter.value.custom(date.toDate(getLocalTimeZone()), { month: 'long' })
   } catch {
@@ -372,8 +375,6 @@ function formatMonthLabel(date: DateValue) {
 }
 
 function formatYearLabel(date: DateValue) {
-  code.value
-
   try {
     return formatter.value.custom(date.toDate(getLocalTimeZone()), { year: 'numeric' })
   } catch {
@@ -488,6 +489,15 @@ const pickerValueProps = computed<Record<string, any>>(() => isStandalonePicker.
       defaultValue: pickerDefaultValue.value
     }
   : {})
+const pickerRootProps = computed(() => ({
+  ...calendarRootProps.value,
+  ...pickerValueProps.value,
+  'placeholder': pickerPlaceholder.value,
+  'locale': code.value,
+  'dir': dir.value,
+  'onUpdate:modelValue': picker.value.onUpdate,
+  'onUpdate:placeholder': onPickerPlaceholderUpdate
+}))
 
 function onPickerPlaceholderUpdate(value: DateValue) {
   if (isStandalonePicker.value) {
@@ -620,18 +630,9 @@ function onPickerPlaceholderUpdate(value: DateValue) {
     :is="picker.root"
     v-else
     v-slot="{ grid, date }"
-    v-bind="pickerValueProps"
-    :placeholder="pickerPlaceholder"
-    :locale="code"
-    :dir="dir"
-    :min-value="minValue"
-    :max-value="maxValue"
-    :disabled="disabled"
-    :readonly="readonly"
+    v-bind="pickerRootProps"
     data-slot="root"
     :class="ui.root({ class: ['inline-flex w-fit flex-col gap-4', uiProp?.root, props.class] })"
-    @update:model-value="picker.onUpdate"
-    @update:placeholder="onPickerPlaceholderUpdate"
   >
     <component
       :is="picker.header"
diff --git a/test/components/Calendar.spec.ts b/test/components/Calendar.spec.ts
index c1f2d34321..f7b820cdc1 100644
--- a/test/components/Calendar.spec.ts
+++ b/test/components/Calendar.spec.ts
@@ -279,6 +279,23 @@ describe('Calendar', () => {
       expect(wrapper.emitted('update:view')?.[0]).toEqual(['month'])
     })
 
+    test('changing defaultView after mount does not reset uncontrolled view', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: { defaultValue: new CalendarDate(2025, 1, 1) }
+      })
+
+      const headingButtons = wrapper.findAll('[data-slot="heading"] button')
+      await headingButtons[0]!.trigger('click')
+      await wrapper.findAll('[data-slot="heading"] button')[1]!.trigger('click')
+
+      expect(wrapper.find('[data-slot="yearGrid"]').exists()).toBe(true)
+
+      await wrapper.setProps({ defaultView: 'month' })
+
+      expect(wrapper.find('[data-slot="yearGrid"]').exists()).toBe(true)
+      expect(wrapper.find('[data-slot="monthGrid"]').exists()).toBe(false)
+    })
+
     test('type="month" keeps the standalone picker heading static', async () => {
       const wrapper = await mountSuspended(Calendar, {
         props: {
@@ -290,6 +307,18 @@ describe('Calendar', () => {
       expect(wrapper.find('[data-slot="monthGrid"]').exists()).toBe(true)
       expect(wrapper.find('[data-slot="heading"] button').exists()).toBe(false)
     })
+
+    test('type="month" forwards root props to the picker root', async () => {
+      const wrapper = await mountSuspended(Calendar, {
+        props: {
+          type: 'month',
+          as: 'section',
+          defaultValue: new CalendarDate(2025, 1, 1)
+        }
+      })
+
+      expect(wrapper.find('[data-slot="root"]').element.tagName).toBe('SECTION')
+    })
   })
 
   describe('labels', () => {

From 6deceb848aabbfd6ff2a3cd2583b7573fcb702c7 Mon Sep 17 00:00:00 2001
From: onmax <maximogarciamtnez@gmail.com>
Date: Tue, 7 Apr 2026 16:02:33 +0200
Subject: [PATCH 4/6] fix(Calendar): use namespaced month and year pickers

---
 src/runtime/components/Calendar.vue           | 92 ++++++-------------
 .../__snapshots__/Calendar-vue.spec.ts.snap   |  8 +-
 .../__snapshots__/Calendar.spec.ts.snap       |  8 +-
 3 files changed, 40 insertions(+), 68 deletions(-)

diff --git a/src/runtime/components/Calendar.vue b/src/runtime/components/Calendar.vue
index c5cf7d0187..221bd4f90b 100644
--- a/src/runtime/components/Calendar.vue
+++ b/src/runtime/components/Calendar.vue
@@ -141,51 +141,15 @@ export interface CalendarSlots {
 
 <script setup lang="ts" generic="R extends boolean, M extends boolean">
 import { computed, ref, shallowRef, watch } from 'vue'
+import { useDateFormatter, useForwardPropsEmits } from 'reka-ui'
 import {
-  MonthPickerRoot,
-  MonthPickerHeader,
-  MonthPickerHeading,
-  MonthPickerGrid,
-  MonthPickerGridBody,
-  MonthPickerGridRow,
-  MonthPickerCell,
-  MonthPickerCellTrigger,
-  MonthPickerPrev,
-  MonthPickerNext,
-  MonthRangePickerRoot,
-  MonthRangePickerHeader,
-  MonthRangePickerHeading,
-  MonthRangePickerGrid,
-  MonthRangePickerGridBody,
-  MonthRangePickerGridRow,
-  MonthRangePickerCell,
-  MonthRangePickerCellTrigger,
-  MonthRangePickerPrev,
-  MonthRangePickerNext,
-  YearPickerRoot,
-  YearPickerHeader,
-  YearPickerHeading,
-  YearPickerGrid,
-  YearPickerGridBody,
-  YearPickerGridRow,
-  YearPickerCell,
-  YearPickerCellTrigger,
-  YearPickerPrev,
-  YearPickerNext,
-  YearRangePickerRoot,
-  YearRangePickerHeader,
-  YearRangePickerHeading,
-  YearRangePickerGrid,
-  YearRangePickerGridBody,
-  YearRangePickerGridRow,
-  YearRangePickerCell,
-  YearRangePickerCellTrigger,
-  YearRangePickerPrev,
-  YearRangePickerNext,
-  useDateFormatter,
-  useForwardPropsEmits
-} from 'reka-ui'
-import { Calendar as SingleCalendar, RangeCalendar } from 'reka-ui/namespaced'
+  Calendar as SingleCalendar,
+  MonthPicker,
+  MonthRangePicker,
+  RangeCalendar,
+  YearPicker,
+  YearRangePicker
+} from 'reka-ui/namespaced'
 import { reactiveOmit } from '@vueuse/core'
 import { useAppConfig } from '#imports'
 import { useComponentUI } from '../composables/useComponentUI'
@@ -434,16 +398,16 @@ function onYearUpdate(value: DateValue | DateRange) {
 
 const monthPicker = computed(() => ({
   kind: 'month' as const,
-  root: props.range ? MonthRangePickerRoot : MonthPickerRoot,
-  header: props.range ? MonthRangePickerHeader : MonthPickerHeader,
-  heading: props.range ? MonthRangePickerHeading : MonthPickerHeading,
-  grid: props.range ? MonthRangePickerGrid : MonthPickerGrid,
-  gridBody: props.range ? MonthRangePickerGridBody : MonthPickerGridBody,
-  gridRow: props.range ? MonthRangePickerGridRow : MonthPickerGridRow,
-  cell: props.range ? MonthRangePickerCell : MonthPickerCell,
-  cellTrigger: props.range ? MonthRangePickerCellTrigger : MonthPickerCellTrigger,
-  prev: props.range ? MonthRangePickerPrev : MonthPickerPrev,
-  next: props.range ? MonthRangePickerNext : MonthPickerNext,
+  root: props.range ? MonthRangePicker.Root : MonthPicker.Root,
+  header: props.range ? MonthRangePicker.Header : MonthPicker.Header,
+  heading: props.range ? MonthRangePicker.Heading : MonthPicker.Heading,
+  grid: props.range ? MonthRangePicker.Grid : MonthPicker.Grid,
+  gridBody: props.range ? MonthRangePicker.GridBody : MonthPicker.GridBody,
+  gridRow: props.range ? MonthRangePicker.GridRow : MonthPicker.GridRow,
+  cell: props.range ? MonthRangePicker.Cell : MonthPicker.Cell,
+  cellTrigger: props.range ? MonthRangePicker.CellTrigger : MonthPicker.CellTrigger,
+  prev: props.range ? MonthRangePicker.Prev : MonthPicker.Prev,
+  next: props.range ? MonthRangePicker.Next : MonthPicker.Next,
   slotName: 'month-cell',
   gridSlot: 'monthGrid',
   rowSlot: 'monthGridRow',
@@ -458,16 +422,16 @@ const monthPicker = computed(() => ({
 
 const yearPicker = computed(() => ({
   kind: 'year' as const,
-  root: props.range ? YearRangePickerRoot : YearPickerRoot,
-  header: props.range ? YearRangePickerHeader : YearPickerHeader,
-  heading: props.range ? YearRangePickerHeading : YearPickerHeading,
-  grid: props.range ? YearRangePickerGrid : YearPickerGrid,
-  gridBody: props.range ? YearRangePickerGridBody : YearPickerGridBody,
-  gridRow: props.range ? YearRangePickerGridRow : YearPickerGridRow,
-  cell: props.range ? YearRangePickerCell : YearPickerCell,
-  cellTrigger: props.range ? YearRangePickerCellTrigger : YearPickerCellTrigger,
-  prev: props.range ? YearRangePickerPrev : YearPickerPrev,
-  next: props.range ? YearRangePickerNext : YearPickerNext,
+  root: props.range ? YearRangePicker.Root : YearPicker.Root,
+  header: props.range ? YearRangePicker.Header : YearPicker.Header,
+  heading: props.range ? YearRangePicker.Heading : YearPicker.Heading,
+  grid: props.range ? YearRangePicker.Grid : YearPicker.Grid,
+  gridBody: props.range ? YearRangePicker.GridBody : YearPicker.GridBody,
+  gridRow: props.range ? YearRangePicker.GridRow : YearPicker.GridRow,
+  cell: props.range ? YearRangePicker.Cell : YearPicker.Cell,
+  cellTrigger: props.range ? YearRangePicker.CellTrigger : YearPicker.CellTrigger,
+  prev: props.range ? YearRangePicker.Prev : YearPicker.Prev,
+  next: props.range ? YearRangePicker.Next : YearPicker.Next,
   slotName: 'year-cell',
   gridSlot: 'yearGrid',
   rowSlot: 'yearGridRow',
diff --git a/test/components/__snapshots__/Calendar-vue.spec.ts.snap b/test/components/__snapshots__/Calendar-vue.spec.ts.snap
index ae32b105bc..c9de48b9fd 100644
--- a/test/components/__snapshots__/Calendar-vue.spec.ts.snap
+++ b/test/components/__snapshots__/Calendar-vue.spec.ts.snap
@@ -3145,7 +3145,9 @@ exports[`Calendar > renders with range and defaultValue correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
@@ -3329,7 +3331,9 @@ exports[`Calendar > renders with range and modelValue correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" data-slot="leadingIcon" class="shrink-0 size-5"></svg>
diff --git a/test/components/__snapshots__/Calendar.spec.ts.snap b/test/components/__snapshots__/Calendar.spec.ts.snap
index 6f51a54ee0..bf67f85c36 100644
--- a/test/components/__snapshots__/Calendar.spec.ts.snap
+++ b/test/components/__snapshots__/Calendar.spec.ts.snap
@@ -3145,7 +3145,9 @@ exports[`Calendar > renders with range and defaultValue correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
@@ -3329,7 +3331,9 @@ exports[`Calendar > renders with range and modelValue correctly 1`] = `
       <!--v-if-->
       <!--v-if-->
     </button>
-    <div data-slot="heading" class="text-center font-medium truncate mx-auto text-sm">January 2025</div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
+    <div data-slot="heading" class="mx-auto text-center font-medium text-sm">
+      <div class="inline-flex items-center gap-1"><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="January, Switch to month view">January</button><button type="button" class="rounded-md px-2 py-0.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accented cursor-pointer hover:bg-elevated/50" aria-label="2025, Switch to year view">2025</button></div>
+    </div><button type="button" aria-label="Next month" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>
       <!--v-if-->
       <!--v-if-->
     </button><button type="button" aria-label="Next year" data-slot="base" class="rounded-md font-medium inline-flex items-center disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors text-sm gap-1.5 text-default hover:bg-elevated active:bg-elevated focus:outline-none focus-visible:bg-elevated hover:disabled:bg-transparent dark:hover:disabled:bg-transparent hover:aria-disabled:bg-transparent dark:hover:aria-disabled:bg-transparent p-1.5"><span class="iconify i-lucide:chevrons-right shrink-0 size-5" aria-hidden="true" data-slot="leadingIcon"></span>

From ece110ee603459c607f37d88e25cd5ed305af360 Mon Sep 17 00:00:00 2001
From: onmax <maximogarciamtnez@gmail.com>
Date: Thu, 16 Apr 2026 09:02:51 +0200
Subject: [PATCH 5/6] refactor(Calendar): simplify PR code

---
 .../calendar/CalendarYearPickerExample.vue    |  19 --
 docs/content/docs/2.components/calendar.md    |  10 -
 src/runtime/components/Calendar.vue           | 172 ++++++---------
 src/runtime/locale/en.ts                      |   6 +-
 src/runtime/types/locale.ts                   |   4 +
 src/theme/calendar.ts                         | 200 ++++++++----------
 6 files changed, 161 insertions(+), 250 deletions(-)
 delete mode 100644 docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue

diff --git a/docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue b/docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue
deleted file mode 100644
index 01530c8f65..0000000000
--- a/docs/app/components/content/examples/calendar/CalendarYearPickerExample.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<script setup lang="ts">
-import type { CalendarDate } from '@internationalized/date'
-
-const modelValue = shallowRef<CalendarDate>()
-
-const label = computed(() => modelValue.value ? String(modelValue.value.year) : 'Select year')
-</script>
-
-<template>
-  <UPopover>
-    <UButton variant="outline" color="neutral" trailing-icon="i-lucide-calendar">
-      {{ label }}
-    </UButton>
-
-    <template #content>
-      <UCalendar v-model="modelValue" type="year" />
-    </template>
-  </UPopover>
-</template>
diff --git a/docs/content/docs/2.components/calendar.md b/docs/content/docs/2.components/calendar.md
index 7f87fc6fbc..6f4dad2a00 100644
--- a/docs/content/docs/2.components/calendar.md
+++ b/docs/content/docs/2.components/calendar.md
@@ -344,16 +344,6 @@ name: 'calendar-month-picker-example'
 ---
 ::
 
-### As a year picker
-
-Use `type="year"` with a [Popover](/docs/components/popover) to create a year picker.
-
-::component-example
----
-name: 'calendar-year-picker-example'
----
-::
-
 ### As a date picker
 
 Use a [Button](/docs/components/button) and a [Popover](/docs/components/popover) component to create a date picker.
diff --git a/src/runtime/components/Calendar.vue b/src/runtime/components/Calendar.vue
index 221bd4f90b..1c859085de 100644
--- a/src/runtime/components/Calendar.vue
+++ b/src/runtime/components/Calendar.vue
@@ -177,16 +177,9 @@ watch(() => code.value, (value) => {
   }
 })
 
-const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.calendar || {}) })({
-  color: props.color,
-  size: props.size,
-  variant: props.variant,
-  weekNumbers: props.weekNumbers
-}))
-
-function getDefaultView(type: CalendarType = props.type, defaultView = props.defaultView) {
-  if (defaultView) {
-    return defaultView
+function getDefaultView(type: CalendarType = props.type) {
+  if (props.defaultView) {
+    return props.defaultView
   }
 
   if (type === 'month') {
@@ -209,7 +202,7 @@ watch(() => [props.type, props.view] as const, ([type, view], [previousType]) =>
   }
 
   if (type !== previousType) {
-    internalView.value = getDefaultView(type as CalendarType, props.defaultView)
+    internalView.value = getDefaultView(type as CalendarType)
   }
 })
 
@@ -235,6 +228,14 @@ const view = computed<CalendarView>({
   }
 })
 
+const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.calendar || {}) })({
+  color: props.color,
+  size: props.size,
+  variant: props.variant,
+  weekNumbers: props.weekNumbers,
+  type: view.value
+}))
+
 function resolveDateValue(value: DateValue | DateValue[] | DateRange | null | undefined) {
   if (Array.isArray(value)) {
     return value[0]
@@ -259,14 +260,6 @@ const localPlaceholder = shallowRef<DateValue | undefined>(props.placeholder)
 
 watch(() => props.placeholder, (value) => {
   localPlaceholder.value = value
-}, { immediate: true })
-
-const dayPlaceholder = computed(() => {
-  if (props.placeholder !== undefined || localPlaceholder.value !== undefined) {
-    return localPlaceholder.value
-  }
-
-  return undefined
 })
 
 const pickerPlaceholder = computed(() => {
@@ -316,43 +309,30 @@ const nextMonthIcon = computed(() => props.nextMonthIcon || (dir.value === 'rtl'
 const prevYearIcon = computed(() => props.prevYearIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronDoubleRight : appConfig.ui.icons.chevronDoubleLeft))
 const prevMonthIcon = computed(() => props.prevMonthIcon || (dir.value === 'rtl' ? appConfig.ui.icons.chevronRight : appConfig.ui.icons.chevronLeft))
 
-const translateWithFallback = (key: string, fallback: string) => {
-  const label = t(key)
-  return label === key ? fallback : label
-}
-
-const prevMonthLabel = computed(() => translateWithFallback('calendar.prevMonth', 'Previous month'))
-const nextMonthLabel = computed(() => translateWithFallback('calendar.nextMonth', 'Next month'))
-const prevYearLabel = computed(() => translateWithFallback('calendar.prevYear', 'Previous year'))
-const nextYearLabel = computed(() => translateWithFallback('calendar.nextYear', 'Next year'))
-const prevDecadeLabel = computed(() => translateWithFallback('calendar.prevDecade', prevYearLabel.value))
-const nextDecadeLabel = computed(() => translateWithFallback('calendar.nextDecade', nextYearLabel.value))
-const switchToMonthsLabel = computed(() => translateWithFallback('calendar.switchToMonths', 'Switch to month view'))
-const switchToYearsLabel = computed(() => translateWithFallback('calendar.switchToYears', 'Switch to year view'))
-
-function formatMonthLabel(date: DateValue) {
-  try {
-    return formatter.value.custom(date.toDate(getLocalTimeZone()), { month: 'long' })
-  } catch {
-    return String(date.month)
-  }
-}
+const prevMonthLabel = computed(() => t('calendar.prevMonth'))
+const nextMonthLabel = computed(() => t('calendar.nextMonth'))
+const prevYearLabel = computed(() => t('calendar.prevYear'))
+const nextYearLabel = computed(() => t('calendar.nextYear'))
+const prevDecadeLabel = computed(() => t('calendar.prevDecade'))
+const nextDecadeLabel = computed(() => t('calendar.nextDecade'))
+const switchToMonthsLabel = computed(() => t('calendar.switchToMonths'))
+const switchToYearsLabel = computed(() => t('calendar.switchToYears'))
 
-function formatYearLabel(date: DateValue) {
+function formatDatePart(date: DateValue, options: Intl.DateTimeFormatOptions, fallback: number) {
   try {
-    return formatter.value.custom(date.toDate(getLocalTimeZone()), { year: 'numeric' })
+    return formatter.value.custom(date.toDate(getLocalTimeZone()), options)
   } catch {
-    return String(date.year)
+    return String(fallback)
   }
 }
 
-function getHeadingValue(date: DateValue, value: Extract<CalendarView, 'month' | 'year'>) {
-  return value === 'month' ? formatMonthLabel(date) : formatYearLabel(date)
-}
+const formatMonthLabel = (date: DateValue) => formatDatePart(date, { month: 'long' }, date.month)
+const formatYearLabel = (date: DateValue) => formatDatePart(date, { year: 'numeric' }, date.year)
 
 function getHeadingLabel(date: DateValue, value: Extract<CalendarView, 'month' | 'year'>) {
+  const formatted = value === 'month' ? formatMonthLabel(date) : formatYearLabel(date)
   const actionLabel = value === 'month' ? switchToMonthsLabel.value : switchToYearsLabel.value
-  return `${getHeadingValue(date, value)}, ${actionLabel}`
+  return `${formatted}, ${actionLabel}`
 }
 
 function getHeadingButtonClass(active: boolean) {
@@ -368,9 +348,8 @@ function emitModelValue(value: DateValue | DateRange) {
 
 const DayCalendar = computed(() => props.range ? RangeCalendar : SingleCalendar)
 const isMonthView = computed(() => view.value === 'month')
-const isYearView = computed(() => view.value === 'year')
 const isNavigationMonthView = computed(() => props.type === 'date' && isMonthView.value)
-const isNavigationYearView = computed(() => props.type === 'date' && isYearView.value)
+const isNavigationYearView = computed(() => props.type === 'date' && view.value === 'year')
 const isStandalonePicker = computed(() => props.type !== 'date')
 const showMonthNavigation = computed(() => props.type === 'date' && view.value === 'day' && props.monthControls)
 
@@ -396,53 +375,28 @@ function onYearUpdate(value: DateValue | DateRange) {
   emitModelValue(value)
 }
 
-const monthPicker = computed(() => ({
-  kind: 'month' as const,
-  root: props.range ? MonthRangePicker.Root : MonthPicker.Root,
-  header: props.range ? MonthRangePicker.Header : MonthPicker.Header,
-  heading: props.range ? MonthRangePicker.Heading : MonthPicker.Heading,
-  grid: props.range ? MonthRangePicker.Grid : MonthPicker.Grid,
-  gridBody: props.range ? MonthRangePicker.GridBody : MonthPicker.GridBody,
-  gridRow: props.range ? MonthRangePicker.GridRow : MonthPicker.GridRow,
-  cell: props.range ? MonthRangePicker.Cell : MonthPicker.Cell,
-  cellTrigger: props.range ? MonthRangePicker.CellTrigger : MonthPicker.CellTrigger,
-  prev: props.range ? MonthRangePicker.Prev : MonthPicker.Prev,
-  next: props.range ? MonthRangePicker.Next : MonthPicker.Next,
-  slotName: 'month-cell',
-  gridSlot: 'monthGrid',
-  rowSlot: 'monthGridRow',
-  cellSlot: 'monthCell',
-  triggerSlot: 'monthCellTrigger',
-  itemProp: 'month',
-  labelProp: 'monthValue',
-  previousLabel: prevYearLabel.value,
-  nextLabel: nextYearLabel.value,
-  onUpdate: onMonthUpdate
-}) as const)
-
-const yearPicker = computed(() => ({
-  kind: 'year' as const,
-  root: props.range ? YearRangePicker.Root : YearPicker.Root,
-  header: props.range ? YearRangePicker.Header : YearPicker.Header,
-  heading: props.range ? YearRangePicker.Heading : YearPicker.Heading,
-  grid: props.range ? YearRangePicker.Grid : YearPicker.Grid,
-  gridBody: props.range ? YearRangePicker.GridBody : YearPicker.GridBody,
-  gridRow: props.range ? YearRangePicker.GridRow : YearPicker.GridRow,
-  cell: props.range ? YearRangePicker.Cell : YearPicker.Cell,
-  cellTrigger: props.range ? YearRangePicker.CellTrigger : YearPicker.CellTrigger,
-  prev: props.range ? YearRangePicker.Prev : YearPicker.Prev,
-  next: props.range ? YearRangePicker.Next : YearPicker.Next,
-  slotName: 'year-cell',
-  gridSlot: 'yearGrid',
-  rowSlot: 'yearGridRow',
-  cellSlot: 'yearCell',
-  triggerSlot: 'yearCellTrigger',
-  itemProp: 'year',
-  labelProp: 'yearValue',
-  previousLabel: prevDecadeLabel.value,
-  nextLabel: nextDecadeLabel.value,
-  onUpdate: onYearUpdate
-}) as const)
+function createPickerConfig(kind: 'month' | 'year') {
+  const ns = kind === 'month'
+    ? { single: MonthPicker, range: MonthRangePicker }
+    : { single: YearPicker, range: YearRangePicker }
+  const source = props.range ? ns.range : ns.single
+  return {
+    kind,
+    root: source.Root, header: source.Header, heading: source.Heading,
+    grid: source.Grid, gridBody: source.GridBody, gridRow: source.GridRow,
+    cell: source.Cell, cellTrigger: source.CellTrigger,
+    prev: source.Prev, next: source.Next,
+    slotName: `${kind}-cell`,
+    itemProp: kind,
+    labelProp: `${kind}Value`,
+    previousLabel: kind === 'month' ? prevYearLabel.value : prevDecadeLabel.value,
+    nextLabel: kind === 'month' ? nextYearLabel.value : nextDecadeLabel.value,
+    onUpdate: kind === 'month' ? onMonthUpdate : onYearUpdate
+  } as const
+}
+
+const monthPicker = computed(() => createPickerConfig('month'))
+const yearPicker = computed(() => createPickerConfig('year'))
 
 const picker = computed<any>(() => isMonthView.value ? monthPicker.value : yearPicker.value)
 const pickerDefaultValue = computed(() => props.defaultValue as DateValue | DateRange | undefined)
@@ -480,7 +434,7 @@ function onPickerPlaceholderUpdate(value: DateValue) {
     v-bind="calendarRootProps"
     :model-value="(modelValue as DateValue | DateValue[])"
     :default-value="(defaultValue as DateValue)"
-    :placeholder="dayPlaceholder"
+    :placeholder="localPlaceholder"
     :locale="code"
     :dir="dir"
     data-slot="root"
@@ -654,10 +608,8 @@ function onPickerPlaceholderUpdate(value: DateValue) {
     <component
       :is="picker.grid"
       as="div"
-      :data-slot="picker.gridSlot"
-      :class="picker.kind === 'month'
-        ? ui.monthGrid({ class: uiProp?.monthGrid })
-        : ui.yearGrid({ class: uiProp?.yearGrid })"
+      data-slot="grid"
+      :class="ui.grid({ class: uiProp?.grid })"
     >
       <component :is="picker.gridBody" as="div">
         <component
@@ -665,10 +617,8 @@ function onPickerPlaceholderUpdate(value: DateValue) {
           v-for="(row, rowIndex) in grid.rows"
           :key="rowIndex"
           as="div"
-          :data-slot="picker.rowSlot"
-          :class="picker.kind === 'month'
-            ? ui.monthGridRow({ class: uiProp?.monthGridRow })
-            : ui.yearGridRow({ class: uiProp?.yearGridRow })"
+          data-slot="gridRow"
+          :class="ui.gridRow({ class: uiProp?.gridRow })"
         >
           <component
             :is="picker.cell"
@@ -676,19 +626,15 @@ function onPickerPlaceholderUpdate(value: DateValue) {
             :key="cellDate.toString()"
             as="div"
             :date="cellDate"
-            :data-slot="picker.cellSlot"
-            :class="picker.kind === 'month'
-              ? ui.monthCell({ class: uiProp?.monthCell })
-              : ui.yearCell({ class: uiProp?.yearCell })"
+            data-slot="cell"
+            :class="ui.cell({ class: uiProp?.cell })"
           >
             <component
               :is="picker.cellTrigger"
               v-slot="slotProps"
               v-bind="{ [picker.itemProp]: cellDate }"
-              :data-slot="picker.triggerSlot"
-              :class="picker.kind === 'month'
-                ? ui.monthCellTrigger({ class: uiProp?.monthCellTrigger })
-                : ui.yearCellTrigger({ class: uiProp?.yearCellTrigger })"
+              data-slot="cellTrigger"
+              :class="ui.cellTrigger({ class: uiProp?.cellTrigger })"
             >
               <slot v-if="picker.kind === 'month'" name="month-cell" :month="cellDate" :selected="slotProps.selected" :disabled="slotProps.disabled">
                 {{ slotProps.monthValue }}
diff --git a/src/runtime/locale/en.ts b/src/runtime/locale/en.ts
index 7eced47986..4bd6144b75 100644
--- a/src/runtime/locale/en.ts
+++ b/src/runtime/locale/en.ts
@@ -17,10 +17,14 @@ export default defineLocale<Messages>({
       close: 'Close'
     },
     calendar: {
+      nextDecade: 'Next decade',
       nextMonth: 'Next month',
       nextYear: 'Next year',
+      prevDecade: 'Previous decade',
       prevMonth: 'Previous month',
-      prevYear: 'Previous year'
+      prevYear: 'Previous year',
+      switchToMonths: 'Switch to month view',
+      switchToYears: 'Switch to year view'
     },
     carousel: {
       dots: 'Choose slide to display',
diff --git a/src/runtime/types/locale.ts b/src/runtime/types/locale.ts
index de30698a20..230471924a 100644
--- a/src/runtime/types/locale.ts
+++ b/src/runtime/types/locale.ts
@@ -11,10 +11,14 @@ export type Messages = {
     close: string
   }
   calendar: {
+    nextDecade?: string
     nextMonth: string
     nextYear: string
+    prevDecade?: string
     prevMonth: string
     prevYear: string
+    switchToMonths?: string
+    switchToYears?: string
   }
   carousel: {
     dots: string
diff --git a/src/theme/calendar.ts b/src/theme/calendar.ts
index a09ab88cfd..7592bbcd98 100644
--- a/src/theme/calendar.ts
+++ b/src/theme/calendar.ts
@@ -1,30 +1,52 @@
 import type { ModuleOptions } from '../module'
 
 type PickerTriggerVariant = 'solid' | 'outline' | 'soft' | 'subtle'
+type CalendarPanelType = 'day' | 'month' | 'year'
 
-function getPickerTriggerClass(color: string, variant: PickerTriggerVariant) {
+const pickerTriggerVariants = ['solid', 'outline', 'soft', 'subtle'] as const
+
+const triggerSizeClasses = {
+  day: {
+    xs: 'size-7',
+    sm: 'size-7',
+    md: 'size-8',
+    lg: 'size-9 text-md',
+    xl: 'size-10 text-lg'
+  },
+  picker: {
+    xs: 'h-7 px-2 text-xs',
+    sm: 'h-7 px-2 text-xs',
+    md: 'h-8 px-3 text-sm',
+    lg: 'h-9 px-4 text-md',
+    xl: 'h-10 px-5 text-lg'
+  }
+} as const
+
+function getTriggerClass(color: string, variant: PickerTriggerVariant, includeToday: boolean) {
+  const today = includeToday ? ` data-today:not-data-[selected]:text-${color}` : ''
   switch (variant) {
     case 'solid':
-      return `data-[selected]:bg-${color} data-[selected]:text-inverted data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+      return `data-[selected]:bg-${color} data-[selected]:text-inverted${today} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
     case 'outline':
-      return `data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/50 data-[selected]:text-${color} data-[highlighted]:bg-${color}/10 hover:not-data-[selected]:bg-${color}/10`
+      return `data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/50 data-[selected]:text-${color}${today} data-[highlighted]:bg-${color}/10 hover:not-data-[selected]:bg-${color}/10`
     case 'soft':
-      return `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+      return `data-[selected]:bg-${color}/10 data-[selected]:text-${color}${today} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
     case 'subtle':
-      return `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/25 data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+      return `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/25${today} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
   }
 }
 
-function getNeutralPickerTriggerClass(variant: PickerTriggerVariant) {
+function getNeutralTriggerClass(variant: PickerTriggerVariant, includeToday: boolean) {
+  const today = includeToday ? ' data-today:not-data-[selected]:text-highlighted' : ''
   switch (variant) {
     case 'solid':
-      return 'data-[selected]:bg-inverted data-[selected]:text-inverted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
+      return `data-[selected]:bg-inverted data-[selected]:text-inverted${today} data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10`
     case 'outline':
-      return 'data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[selected]:text-default data-[selected]:bg-default data-[highlighted]:bg-inverted/10 hover:not-data-[selected]:bg-inverted/10'
+      return `data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[selected]:text-default data-[selected]:bg-default${today} data-[highlighted]:bg-inverted/10 hover:not-data-[selected]:bg-inverted/10`
     case 'soft':
-      return 'data-[selected]:bg-elevated data-[selected]:text-default data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
+      return `data-[selected]:bg-elevated data-[selected]:text-default${today} data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10`
     case 'subtle':
-      return 'data-[selected]:bg-elevated data-[selected]:text-default data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10'
+      return `data-[selected]:bg-elevated data-[selected]:text-default data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented${today} data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10`
   }
 }
 
@@ -34,37 +56,25 @@ export default (options: Required<ModuleOptions>) => ({
     header: 'flex items-center justify-between',
     body: 'flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0',
     heading: 'mx-auto text-center font-medium',
-    grid: 'w-full border-collapse select-none space-y-1 focus:outline-none',
-    gridRow: 'grid grid-cols-7 place-items-center',
+    grid: 'w-full select-none space-y-1 focus:outline-none',
+    gridRow: 'grid',
     gridWeekDaysRow: 'mb-1 grid w-full grid-cols-7',
     gridBody: 'grid',
     headCell: 'rounded-md',
     headCellWeek: 'rounded-md text-muted',
     cell: 'relative text-center',
-    cellTrigger: ['m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted', options.theme.transitions && 'transition'],
-    cellWeek: 'relative text-center text-muted',
-    monthGrid: 'w-full select-none space-y-1 focus:outline-none',
-    monthGridRow: 'grid grid-cols-4 gap-1',
-    monthCell: 'relative text-center',
-    monthCellTrigger: ['relative flex w-full items-center justify-center rounded-md whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted', options.theme.transitions && 'transition'],
-    yearGrid: 'w-full select-none space-y-1 focus:outline-none',
-    yearGridRow: 'grid grid-cols-4 gap-1',
-    yearCell: 'relative text-center',
-    yearCellTrigger: ['relative flex w-full items-center justify-center rounded-md whitespace-nowrap tabular-nums focus-visible:ring-2 focus:outline-none data-disabled:text-muted', options.theme.transitions && 'transition']
+    cellTrigger: ['relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted', options.theme.transitions && 'transition'],
+    cellWeek: 'relative text-center text-muted'
   },
   variants: {
     color: {
       ...Object.fromEntries((options.theme.colors || []).map((color: string) => [color, {
         headCell: `text-${color}`,
-        cellTrigger: `focus-visible:ring-${color}`,
-        monthCellTrigger: `focus-visible:ring-${color}`,
-        yearCellTrigger: `focus-visible:ring-${color}`
+        cellTrigger: `focus-visible:ring-${color}`
       }])),
       neutral: {
         headCell: 'text-highlighted',
-        cellTrigger: 'focus-visible:ring-inverted',
-        monthCellTrigger: 'focus-visible:ring-inverted',
-        yearCellTrigger: 'focus-visible:ring-inverted'
+        cellTrigger: 'focus-visible:ring-inverted'
       }
     },
     variant: {
@@ -73,6 +83,21 @@ export default (options: Required<ModuleOptions>) => ({
       soft: '',
       subtle: ''
     },
+    type: {
+      day: {
+        grid: 'border-collapse',
+        gridRow: 'grid-cols-7 place-items-center',
+        cellTrigger: 'm-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted'
+      },
+      month: {
+        gridRow: 'grid-cols-4 gap-1',
+        cellTrigger: 'w-full rounded-md'
+      },
+      year: {
+        gridRow: 'grid-cols-4 gap-1',
+        cellTrigger: 'w-full rounded-md tabular-nums'
+      }
+    },
     size: {
       xs: {
         heading: 'text-xs',
@@ -80,132 +105,93 @@ export default (options: Required<ModuleOptions>) => ({
         cellWeek: 'text-xs',
         headCell: 'text-[10px]',
         headCellWeek: 'text-[10px]',
-        cellTrigger: 'size-7',
-        body: 'space-y-2 pt-2',
-        monthCellTrigger: 'h-7 px-2 text-xs',
-        yearCellTrigger: 'h-7 px-2 text-xs'
+        body: 'space-y-2 pt-2'
       },
       sm: {
         heading: 'text-xs',
         headCell: 'text-xs',
         headCellWeek: 'text-xs',
         cellWeek: 'text-xs',
-        cell: 'text-xs',
-        cellTrigger: 'size-7',
-        monthCellTrigger: 'h-7 px-2 text-xs',
-        yearCellTrigger: 'h-7 px-2 text-xs'
+        cell: 'text-xs'
       },
       md: {
         heading: 'text-sm',
         headCell: 'text-xs',
         headCellWeek: 'text-xs',
         cellWeek: 'text-xs',
-        cell: 'text-sm',
-        cellTrigger: 'size-8',
-        monthCellTrigger: 'h-8 px-3 text-sm',
-        yearCellTrigger: 'h-8 px-3 text-sm'
+        cell: 'text-sm'
       },
       lg: {
         heading: 'text-md',
         headCell: 'text-md',
-        headCellWeek: 'text-md',
-        cellTrigger: 'size-9 text-md',
-        monthCellTrigger: 'h-9 px-4 text-md',
-        yearCellTrigger: 'h-9 px-4 text-md'
+        headCellWeek: 'text-md'
       },
       xl: {
         heading: 'text-lg',
         headCell: 'text-lg',
-        headCellWeek: 'text-lg',
-        cellTrigger: 'size-10 text-lg',
-        monthCellTrigger: 'h-10 px-5 text-lg',
-        yearCellTrigger: 'h-10 px-5 text-lg'
+        headCellWeek: 'text-lg'
       }
     },
     weekNumbers: {
-      true: {
-        gridRow: 'grid-cols-8',
-        gridWeekDaysRow: 'grid-cols-8 [&>*:first-child]:col-start-2'
-      }
+      true: ''
     }
   },
   compoundVariants: [
-    ...(options.theme.colors || []).map((color: string) => ({
-      color,
-      variant: 'solid',
-      class: {
-        cellTrigger: `data-[selected]:bg-${color} data-[selected]:text-inverted data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
-      }
+    ...Object.entries(triggerSizeClasses.day).map(([size, cellTrigger]) => ({
+      size,
+      type: 'day' as CalendarPanelType,
+      class: { cellTrigger }
     })),
-    ...(options.theme.colors || []).map((color: string) => ({
-      color,
-      variant: 'outline',
-      class: {
-        cellTrigger: `data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/50 data-[selected]:text-${color} data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/10 hover:not-data-[selected]:bg-${color}/10`
-      }
+    ...Object.entries(triggerSizeClasses.picker).map(([size, cellTrigger]) => ({
+      size,
+      type: ['month', 'year'] as CalendarPanelType[],
+      class: { cellTrigger }
     })),
-    ...(options.theme.colors || []).map((color: string) => ({
-      color,
-      variant: 'soft',
+    {
+      type: 'day',
+      weekNumbers: true,
       class: {
-        cellTrigger: `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+        gridRow: 'grid-cols-8',
+        gridWeekDaysRow: 'grid-cols-8 [&>*:first-child]:col-start-2'
       }
-    })),
-    ...(options.theme.colors || []).map((color: string) => ({
+    },
+    ...(options.theme.colors || []).flatMap((color: string) => pickerTriggerVariants.map(variant => ({
       color,
-      variant: 'subtle',
+      variant,
+      type: 'day' as CalendarPanelType,
       class: {
-        cellTrigger: `data-[selected]:bg-${color}/10 data-[selected]:text-${color} data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-${color}/25 data-today:not-data-[selected]:text-${color} data-[highlighted]:bg-${color}/20 hover:not-data-[selected]:bg-${color}/20`
+        cellTrigger: getTriggerClass(color, variant, true)
       }
-    })),
-    ...(options.theme.colors || []).flatMap((color: string) => (['solid', 'outline', 'soft', 'subtle'] as PickerTriggerVariant[]).map(variant => ({
+    }))),
+    ...(options.theme.colors || []).flatMap((color: string) => pickerTriggerVariants.map(variant => ({
       color,
       variant,
+      type: ['month', 'year'] as CalendarPanelType[],
       class: {
-        monthCellTrigger: getPickerTriggerClass(color, variant),
-        yearCellTrigger: getPickerTriggerClass(color, variant)
+        cellTrigger: getTriggerClass(color, variant, false)
       }
     }))),
-    {
-      color: 'neutral',
-      variant: 'solid',
-      class: {
-        cellTrigger: 'data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10',
-        monthCellTrigger: getNeutralPickerTriggerClass('solid'),
-        yearCellTrigger: getNeutralPickerTriggerClass('solid')
-      }
-    },
-    {
+    ...pickerTriggerVariants.map(variant => ({
       color: 'neutral',
-      variant: 'outline',
-      class: {
-        cellTrigger: 'data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-[selected]:text-default data-[selected]:bg-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/10 hover:not-data-[selected]:bg-inverted/10',
-        monthCellTrigger: getNeutralPickerTriggerClass('outline'),
-        yearCellTrigger: getNeutralPickerTriggerClass('outline')
-      }
-    },
-    {
-      color: 'neutral',
-      variant: 'soft',
+      variant,
+      type: 'day' as CalendarPanelType,
       class: {
-        cellTrigger: 'data-[selected]:bg-elevated data-[selected]:text-default data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10',
-        monthCellTrigger: getNeutralPickerTriggerClass('soft'),
-        yearCellTrigger: getNeutralPickerTriggerClass('soft')
+        cellTrigger: getNeutralTriggerClass(variant, true)
       }
-    },
-    {
+    })),
+    ...pickerTriggerVariants.map(variant => ({
       color: 'neutral',
-      variant: 'subtle',
+      variant,
+      type: ['month', 'year'] as CalendarPanelType[],
       class: {
-        cellTrigger: 'data-[selected]:bg-elevated data-[selected]:text-default data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-accented data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10',
-        monthCellTrigger: getNeutralPickerTriggerClass('subtle'),
-        yearCellTrigger: getNeutralPickerTriggerClass('subtle')
+        cellTrigger: getNeutralTriggerClass(variant, false)
       }
-    }
+    }))
   ],
   defaultVariants: {
     size: 'md',
     color: 'primary',
-    variant: 'solid'
+    variant: 'solid',
+    type: 'day'
   }
 })

From 1822c677fe966b1f649bfe87b95ceea4bc26e068 Mon Sep 17 00:00:00 2001
From: onmax <maximogarciamtnez@gmail.com>
Date: Wed, 22 Apr 2026 09:43:43 +0200
Subject: [PATCH 6/6] fix(calendar): restore picker test contract after rebase

---
 src/runtime/components/Calendar.vue           |   25 +-
 .../__snapshots__/Calendar-vue.spec.ts.snap   | 3254 ++++++++---------
 .../__snapshots__/Calendar.spec.ts.snap       | 3254 ++++++++---------
 test/nuxt/setup.ts                            |   45 +
 test/utils/setup.ts                           |   41 +
 5 files changed, 3361 insertions(+), 3258 deletions(-)

diff --git a/src/runtime/components/Calendar.vue b/src/runtime/components/Calendar.vue
index 1c859085de..3caee979fd 100644
--- a/src/runtime/components/Calendar.vue
+++ b/src/runtime/components/Calendar.vue
@@ -399,6 +399,23 @@ const monthPicker = computed(() => createPickerConfig('month'))
 const yearPicker = computed(() => createPickerConfig('year'))
 
 const picker = computed<any>(() => isMonthView.value ? monthPicker.value : yearPicker.value)
+const pickerSlotNames = computed(() => {
+  if (picker.value.kind === 'month') {
+    return {
+      grid: 'monthGrid',
+      row: 'monthGridRow',
+      cell: 'monthCell',
+      trigger: 'monthCellTrigger'
+    } as const
+  }
+
+  return {
+    grid: 'yearGrid',
+    row: 'yearGridRow',
+    cell: 'yearCell',
+    trigger: 'yearCellTrigger'
+  } as const
+})
 const pickerDefaultValue = computed(() => props.defaultValue as DateValue | DateRange | undefined)
 const pickerModelValue = computed(() => props.modelValue as DateValue | DateRange | undefined)
 const pickerValueProps = computed<Record<string, any>>(() => isStandalonePicker.value
@@ -608,7 +625,7 @@ function onPickerPlaceholderUpdate(value: DateValue) {
     <component
       :is="picker.grid"
       as="div"
-      data-slot="grid"
+      :data-slot="pickerSlotNames.grid"
       :class="ui.grid({ class: uiProp?.grid })"
     >
       <component :is="picker.gridBody" as="div">
@@ -617,7 +634,7 @@ function onPickerPlaceholderUpdate(value: DateValue) {
           v-for="(row, rowIndex) in grid.rows"
           :key="rowIndex"
           as="div"
-          data-slot="gridRow"
+          :data-slot="pickerSlotNames.row"
           :class="ui.gridRow({ class: uiProp?.gridRow })"
         >
           <component
@@ -626,14 +643,14 @@ function onPickerPlaceholderUpdate(value: DateValue) {
             :key="cellDate.toString()"
             as="div"
             :date="cellDate"
-            data-slot="cell"
+            :data-slot="pickerSlotNames.cell"
             :class="ui.cell({ class: uiProp?.cell })"
           >
             <component
               :is="picker.cellTrigger"
               v-slot="slotProps"
               v-bind="{ [picker.itemProp]: cellDate }"
-              data-slot="cellTrigger"
+              :data-slot="pickerSlotNames.trigger"
               :class="ui.cellTrigger({ class: uiProp?.cellTrigger })"
             >
               <slot v-if="picker.kind === 'month'" name="month-cell" :month="cellDate" :selected="slotProps.selected" :disabled="slotProps.disabled">
diff --git a/test/components/__snapshots__/Calendar-vue.spec.ts.snap b/test/components/__snapshots__/Calendar-vue.spec.ts.snap
index c9de48b9fd..e75d067c54 100644
--- a/test/components/__snapshots__/Calendar-vue.spec.ts.snap
+++ b/test/components/__snapshots__/Calendar-vue.spec.ts.snap
@@ -20,7 +20,7 @@ exports[`Calendar > renders with as correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -36,145 +36,145 @@ exports[`Calendar > renders with as correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -206,7 +206,7 @@ exports[`Calendar > renders with class correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -222,145 +222,145 @@ exports[`Calendar > renders with class correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -392,7 +392,7 @@ exports[`Calendar > renders with color neutral correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-highlighted text-xs">S</th>
@@ -408,145 +408,145 @@ exports[`Calendar > renders with color neutral correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
           </td>
         </tr>
       </tbody>
@@ -578,7 +578,7 @@ exports[`Calendar > renders with day slot correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -594,145 +594,145 @@ exports[`Calendar > renders with day slot correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -764,7 +764,7 @@ exports[`Calendar > renders with default value correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -780,145 +780,145 @@ exports[`Calendar > renders with default value correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -950,7 +950,7 @@ exports[`Calendar > renders with disabled correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" aria-disabled="true" data-disabled="" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" aria-disabled="true" data-disabled="" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -966,145 +966,145 @@ exports[`Calendar > renders with disabled correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1134,7 +1134,7 @@ exports[`Calendar > renders with heading slot correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1150,145 +1150,145 @@ exports[`Calendar > renders with heading slot correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1320,7 +1320,7 @@ exports[`Calendar > renders with isDateDisabled correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1336,145 +1336,145 @@ exports[`Calendar > renders with isDateDisabled correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1506,7 +1506,7 @@ exports[`Calendar > renders with isDateUnavailable correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1522,145 +1522,145 @@ exports[`Calendar > renders with isDateUnavailable correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-unavailable="" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-unavailable="" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1692,7 +1692,7 @@ exports[`Calendar > renders with modelValue correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1708,145 +1708,145 @@ exports[`Calendar > renders with modelValue correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1878,7 +1878,7 @@ exports[`Calendar > renders with multiple correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1894,145 +1894,145 @@ exports[`Calendar > renders with multiple correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2064,7 +2064,7 @@ exports[`Calendar > renders with nextMonth correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2080,145 +2080,145 @@ exports[`Calendar > renders with nextMonth correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2250,7 +2250,7 @@ exports[`Calendar > renders with nextYear correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2266,145 +2266,145 @@ exports[`Calendar > renders with nextYear correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2436,7 +2436,7 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2452,150 +2452,150 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
     </table>
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2611,145 +2611,145 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Monday, February 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Tuesday, February 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Wednesday, February 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Thursday, February 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Friday, February 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Saturday, February 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Sunday, February 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Monday, February 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Tuesday, February 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Wednesday, February 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Thursday, February 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Friday, February 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Saturday, February 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Sunday, February 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Monday, February 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Tuesday, February 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Wednesday, February 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Thursday, February 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Friday, February 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, March 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, March 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, March 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, March 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, March 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, March 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, March 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, March 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, March 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, March 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, March 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, March 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, March 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, March 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, March 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, March 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2781,7 +2781,7 @@ exports[`Calendar > renders with prevMonth correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2797,145 +2797,145 @@ exports[`Calendar > renders with prevMonth correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2967,7 +2967,7 @@ exports[`Calendar > renders with prevYear correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2983,145 +2983,145 @@ exports[`Calendar > renders with prevYear correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3156,7 +3156,7 @@ exports[`Calendar > renders with range and defaultValue correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3172,145 +3172,145 @@ exports[`Calendar > renders with range and defaultValue correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3342,7 +3342,7 @@ exports[`Calendar > renders with range and modelValue correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3358,145 +3358,145 @@ exports[`Calendar > renders with range and modelValue correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3528,7 +3528,7 @@ exports[`Calendar > renders with range correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3544,145 +3544,145 @@ exports[`Calendar > renders with range correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3711,7 +3711,7 @@ exports[`Calendar > renders with readonly correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" aria-readonly="true" data-readonly="" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" aria-readonly="true" data-readonly="" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3727,145 +3727,145 @@ exports[`Calendar > renders with readonly correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3897,7 +3897,7 @@ exports[`Calendar > renders with size lg correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-md">S</th>
@@ -3913,145 +3913,145 @@ exports[`Calendar > renders with size lg correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4083,7 +4083,7 @@ exports[`Calendar > renders with size md correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -4099,145 +4099,145 @@ exports[`Calendar > renders with size md correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4269,7 +4269,7 @@ exports[`Calendar > renders with size sm correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -4285,145 +4285,145 @@ exports[`Calendar > renders with size sm correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4455,7 +4455,7 @@ exports[`Calendar > renders with size xl correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-lg">S</th>
@@ -4471,145 +4471,145 @@ exports[`Calendar > renders with size xl correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4641,7 +4641,7 @@ exports[`Calendar > renders with size xs correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col sm:flex-row sm:space-x-4 sm:space-y-0 space-y-2 pt-2">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-[10px]">S</th>
@@ -4657,145 +4657,145 @@ exports[`Calendar > renders with size xs correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4827,7 +4827,7 @@ exports[`Calendar > renders with ui correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -4843,145 +4843,145 @@ exports[`Calendar > renders with ui correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5013,7 +5013,7 @@ exports[`Calendar > renders with variant outline correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5029,145 +5029,145 @@ exports[`Calendar > renders with variant outline correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
           </td>
         </tr>
       </tbody>
@@ -5199,7 +5199,7 @@ exports[`Calendar > renders with variant soft correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5215,145 +5215,145 @@ exports[`Calendar > renders with variant soft correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5385,7 +5385,7 @@ exports[`Calendar > renders with variant solid correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5401,145 +5401,145 @@ exports[`Calendar > renders with variant solid correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5571,7 +5571,7 @@ exports[`Calendar > renders with variant subtle correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5587,145 +5587,145 @@ exports[`Calendar > renders with variant subtle correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5757,7 +5757,7 @@ exports[`Calendar > renders with week-day slot correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5773,145 +5773,145 @@ exports[`Calendar > renders with week-day slot correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5943,7 +5943,7 @@ exports[`Calendar > renders with weekNumbers correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-8 [&amp;>*:first-child]:col-start-2">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5959,145 +5959,145 @@ exports[`Calendar > renders with weekNumbers correctly 1`] = `
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">1</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">2</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">3</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">4</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">5</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">6</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -6129,7 +6129,7 @@ exports[`Calendar > renders with weekStartsOn correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">M</th>
@@ -6145,145 +6145,145 @@ exports[`Calendar > renders with weekStartsOn correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
         </tr>
       </tbody>
@@ -6315,7 +6315,7 @@ exports[`Calendar > renders with weekdayFormat correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">Sun</th>
@@ -6331,145 +6331,145 @@ exports[`Calendar > renders with weekdayFormat correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -6501,7 +6501,7 @@ exports[`Calendar > renders without fixedWeeks correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -6517,121 +6517,121 @@ exports[`Calendar > renders without fixedWeeks correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
       </tbody>
@@ -6659,7 +6659,7 @@ exports[`Calendar > renders without monthControls correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -6675,145 +6675,145 @@ exports[`Calendar > renders without monthControls correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -6841,7 +6841,7 @@ exports[`Calendar > renders without yearControls correctly 1`] = `
     <!--v-if-->
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -6857,145 +6857,145 @@ exports[`Calendar > renders without yearControls correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
diff --git a/test/components/__snapshots__/Calendar.spec.ts.snap b/test/components/__snapshots__/Calendar.spec.ts.snap
index bf67f85c36..a162fd2afd 100644
--- a/test/components/__snapshots__/Calendar.spec.ts.snap
+++ b/test/components/__snapshots__/Calendar.spec.ts.snap
@@ -20,7 +20,7 @@ exports[`Calendar > renders with as correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -36,145 +36,145 @@ exports[`Calendar > renders with as correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -206,7 +206,7 @@ exports[`Calendar > renders with class correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -222,145 +222,145 @@ exports[`Calendar > renders with class correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -392,7 +392,7 @@ exports[`Calendar > renders with color neutral correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-highlighted text-xs">S</th>
@@ -408,145 +408,145 @@ exports[`Calendar > renders with color neutral correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-inverted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-inverted m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-inverted data-[selected]:text-inverted data-today:not-data-[selected]:text-highlighted data-[highlighted]:bg-inverted/20 hover:not-data-[selected]:bg-inverted/10">8</div>
           </td>
         </tr>
       </tbody>
@@ -578,7 +578,7 @@ exports[`Calendar > renders with day slot correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -594,145 +594,145 @@ exports[`Calendar > renders with day slot correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -764,7 +764,7 @@ exports[`Calendar > renders with default value correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -780,145 +780,145 @@ exports[`Calendar > renders with default value correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -950,7 +950,7 @@ exports[`Calendar > renders with disabled correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" aria-disabled="true" data-disabled="" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" aria-disabled="true" data-disabled="" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -966,145 +966,145 @@ exports[`Calendar > renders with disabled correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1134,7 +1134,7 @@ exports[`Calendar > renders with heading slot correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1150,145 +1150,145 @@ exports[`Calendar > renders with heading slot correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1320,7 +1320,7 @@ exports[`Calendar > renders with isDateDisabled correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1336,145 +1336,145 @@ exports[`Calendar > renders with isDateDisabled correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-disabled="" data-today="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-disabled="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-disabled="" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-disabled="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1506,7 +1506,7 @@ exports[`Calendar > renders with isDateUnavailable correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1522,145 +1522,145 @@ exports[`Calendar > renders with isDateUnavailable correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-29" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-30" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2024-12-31" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-unavailable="" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-01" data-unavailable="" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-02" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-03" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-04" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-05" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-06" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-07" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-08" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-09" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-10" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-11" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-12" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-13" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-14" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-15" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-16" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-17" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-18" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-19" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-20" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-21" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-22" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-23" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-24" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-25" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-26" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-27" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-28" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-29" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-30" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-01-31" data-unavailable="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-01" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-02" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-03" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-04" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-05" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-06" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-07" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="true" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" aria-disabled="true" data-value="2025-02-08" data-unavailable="" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1692,7 +1692,7 @@ exports[`Calendar > renders with modelValue correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1708,145 +1708,145 @@ exports[`Calendar > renders with modelValue correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -1878,7 +1878,7 @@ exports[`Calendar > renders with multiple correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -1894,145 +1894,145 @@ exports[`Calendar > renders with multiple correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2064,7 +2064,7 @@ exports[`Calendar > renders with nextMonth correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2080,145 +2080,145 @@ exports[`Calendar > renders with nextMonth correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2250,7 +2250,7 @@ exports[`Calendar > renders with nextYear correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2266,145 +2266,145 @@ exports[`Calendar > renders with nextYear correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2436,7 +2436,7 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2452,150 +2452,150 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
     </table>
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2611,145 +2611,145 @@ exports[`Calendar > renders with numberOfMonths correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Monday, February 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Tuesday, February 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Wednesday, February 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Thursday, February 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Friday, February 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Saturday, February 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Sunday, February 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Monday, February 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Tuesday, February 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Wednesday, February 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Thursday, February 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Friday, February 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Saturday, February 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Sunday, February 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Monday, February 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Tuesday, February 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Wednesday, February 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Thursday, February 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Friday, February 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, March 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, March 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, March 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, March 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, March 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, March 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, March 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, March 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, March 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, March 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, March 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, March 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, March 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, March 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, March 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, March 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-03-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2781,7 +2781,7 @@ exports[`Calendar > renders with prevMonth correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2797,145 +2797,145 @@ exports[`Calendar > renders with prevMonth correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -2967,7 +2967,7 @@ exports[`Calendar > renders with prevYear correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -2983,145 +2983,145 @@ exports[`Calendar > renders with prevYear correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3156,7 +3156,7 @@ exports[`Calendar > renders with range and defaultValue correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3172,145 +3172,145 @@ exports[`Calendar > renders with range and defaultValue correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3342,7 +3342,7 @@ exports[`Calendar > renders with range and modelValue correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3358,145 +3358,145 @@ exports[`Calendar > renders with range and modelValue correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-start="true" data-selected="true" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" aria-pressed="true" data-selection-end="true" data-selected="true" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3528,7 +3528,7 @@ exports[`Calendar > renders with range correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3544,145 +3544,145 @@ exports[`Calendar > renders with range correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-29" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-30" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2024-12-31" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-01" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-02" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-03" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-04" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-05" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-06" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-07" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-outside-visible-view="" data-value="2025-02-08" data-outside-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3711,7 +3711,7 @@ exports[`Calendar > renders with readonly correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" aria-readonly="true" data-readonly="" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" aria-readonly="true" data-readonly="" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -3727,145 +3727,145 @@ exports[`Calendar > renders with readonly correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -3897,7 +3897,7 @@ exports[`Calendar > renders with size lg correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-md">S</th>
@@ -3913,145 +3913,145 @@ exports[`Calendar > renders with size lg correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-9 text-md data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4083,7 +4083,7 @@ exports[`Calendar > renders with size md correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -4099,145 +4099,145 @@ exports[`Calendar > renders with size md correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4269,7 +4269,7 @@ exports[`Calendar > renders with size sm correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -4285,145 +4285,145 @@ exports[`Calendar > renders with size sm correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4455,7 +4455,7 @@ exports[`Calendar > renders with size xl correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-lg">S</th>
@@ -4471,145 +4471,145 @@ exports[`Calendar > renders with size xl correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-10 text-lg data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4641,7 +4641,7 @@ exports[`Calendar > renders with size xs correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col sm:flex-row sm:space-x-4 sm:space-y-0 space-y-2 pt-2">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-[10px]">S</th>
@@ -4657,145 +4657,145 @@ exports[`Calendar > renders with size xs correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-xs">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-7 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -4827,7 +4827,7 @@ exports[`Calendar > renders with ui correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -4843,145 +4843,145 @@ exports[`Calendar > renders with ui correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5013,7 +5013,7 @@ exports[`Calendar > renders with variant outline correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5029,145 +5029,145 @@ exports[`Calendar > renders with variant outline correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/50 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/10 hover:not-data-[selected]:bg-primary/10">8</div>
           </td>
         </tr>
       </tbody>
@@ -5199,7 +5199,7 @@ exports[`Calendar > renders with variant soft correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5215,145 +5215,145 @@ exports[`Calendar > renders with variant soft correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5385,7 +5385,7 @@ exports[`Calendar > renders with variant solid correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5401,145 +5401,145 @@ exports[`Calendar > renders with variant solid correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5571,7 +5571,7 @@ exports[`Calendar > renders with variant subtle correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5587,145 +5587,145 @@ exports[`Calendar > renders with variant subtle correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-selected="true" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-selected="true" data-value="2025-01-15" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary/10 data-[selected]:text-primary data-[selected]:ring data-[selected]:ring-inset data-[selected]:ring-primary/25 data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5757,7 +5757,7 @@ exports[`Calendar > renders with week-day slot correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5773,145 +5773,145 @@ exports[`Calendar > renders with week-day slot correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -5943,7 +5943,7 @@ exports[`Calendar > renders with weekNumbers correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-8 [&amp;>*:first-child]:col-start-2">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -5959,145 +5959,145 @@ exports[`Calendar > renders with weekNumbers correctly 1`] = `
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">1</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">2</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">3</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">4</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">5</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid place-items-center grid-cols-8">
           <td role="gridcell" data-slot="cellWeek" class="relative text-center text-muted text-xs">6</td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -6129,7 +6129,7 @@ exports[`Calendar > renders with weekStartsOn correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">M</th>
@@ -6145,145 +6145,145 @@ exports[`Calendar > renders with weekStartsOn correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Sunday, February 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-09" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
         </tr>
       </tbody>
@@ -6315,7 +6315,7 @@ exports[`Calendar > renders with weekdayFormat correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">Sun</th>
@@ -6331,145 +6331,145 @@ exports[`Calendar > renders with weekdayFormat correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -6501,7 +6501,7 @@ exports[`Calendar > renders without fixedWeeks correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -6517,121 +6517,121 @@ exports[`Calendar > renders without fixedWeeks correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
       </tbody>
@@ -6659,7 +6659,7 @@ exports[`Calendar > renders without monthControls correctly 1`] = `
     </button>
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -6675,145 +6675,145 @@ exports[`Calendar > renders without monthControls correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
@@ -6841,7 +6841,7 @@ exports[`Calendar > renders without yearControls correctly 1`] = `
     <!--v-if-->
   </div>
   <div data-slot="body" class="flex flex-col space-y-4 pt-4 sm:flex-row sm:space-x-4 sm:space-y-0">
-    <table tabindex="-1" role="application" data-slot="grid" class="w-full border-collapse select-none space-y-1 focus:outline-none">
+    <table tabindex="-1" role="application" data-slot="grid" class="w-full select-none space-y-1 focus:outline-none border-collapse">
       <thead aria-hidden="true">
         <tr data-slot="gridWeekDaysRow" class="mb-1 grid w-full grid-cols-7">
           <th data-slot="headCell" class="rounded-md text-primary text-xs">S</th>
@@ -6857,145 +6857,145 @@ exports[`Calendar > renders without yearControls correctly 1`] = `
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Sunday, December 29, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-29" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Monday, December 30, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-30" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Tuesday, December 31, 2024" data-reka-calendar-cell-trigger="" data-value="2024-12-31" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Wednesday, January 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-01" data-today="" data-focused="" tabindex="0" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Thursday, January 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-02" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Friday, January 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-03" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Saturday, January 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-04" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Sunday, January 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-05" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Monday, January 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-06" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Tuesday, January 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-07" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Wednesday, January 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-08" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
+            <div role="button" aria-label="Thursday, January 9, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-09" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">9</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
+            <div role="button" aria-label="Friday, January 10, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-10" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">10</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
+            <div role="button" aria-label="Saturday, January 11, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-11" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">11</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
+            <div role="button" aria-label="Sunday, January 12, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-12" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">12</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
+            <div role="button" aria-label="Monday, January 13, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-13" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">13</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
+            <div role="button" aria-label="Tuesday, January 14, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-14" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">14</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
+            <div role="button" aria-label="Wednesday, January 15, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-15" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">15</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
+            <div role="button" aria-label="Thursday, January 16, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-16" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">16</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
+            <div role="button" aria-label="Friday, January 17, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-17" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">17</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
+            <div role="button" aria-label="Saturday, January 18, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-18" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">18</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
+            <div role="button" aria-label="Sunday, January 19, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-19" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">19</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
+            <div role="button" aria-label="Monday, January 20, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-20" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">20</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
+            <div role="button" aria-label="Tuesday, January 21, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-21" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">21</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
+            <div role="button" aria-label="Wednesday, January 22, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-22" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">22</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
+            <div role="button" aria-label="Thursday, January 23, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-23" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">23</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
+            <div role="button" aria-label="Friday, January 24, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-24" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">24</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
+            <div role="button" aria-label="Saturday, January 25, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-25" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">25</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
+            <div role="button" aria-label="Sunday, January 26, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-26" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">26</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
+            <div role="button" aria-label="Monday, January 27, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-27" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">27</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
+            <div role="button" aria-label="Tuesday, January 28, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-28" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">28</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
+            <div role="button" aria-label="Wednesday, January 29, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-29" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">29</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
+            <div role="button" aria-label="Thursday, January 30, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-30" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">30</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
+            <div role="button" aria-label="Friday, January 31, 2025" data-reka-calendar-cell-trigger="" data-value="2025-01-31" tabindex="-1" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">31</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
+            <div role="button" aria-label="Saturday, February 1, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-01" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">1</div>
           </td>
         </tr>
         <tr data-slot="gridRow" class="grid grid-cols-7 place-items-center">
           <!--v-if-->
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
+            <div role="button" aria-label="Sunday, February 2, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-02" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">2</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
+            <div role="button" aria-label="Monday, February 3, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-03" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">3</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
+            <div role="button" aria-label="Tuesday, February 4, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-04" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">4</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
+            <div role="button" aria-label="Wednesday, February 5, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-05" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">5</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
+            <div role="button" aria-label="Thursday, February 6, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-06" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">6</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
+            <div role="button" aria-label="Friday, February 7, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-07" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">7</div>
           </td>
           <td role="gridcell" aria-disabled="false" data-slot="cell" class="relative text-center text-sm">
-            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="m-0.5 relative flex items-center justify-center rounded-full whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted transition focus-visible:ring-primary size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
+            <div role="button" aria-label="Saturday, February 8, 2025" data-reka-calendar-cell-trigger="" data-value="2025-02-08" data-outside-view="" data-outside-visible-view="" data-slot="cellTrigger" class="relative flex items-center justify-center whitespace-nowrap focus-visible:ring-2 focus:outline-none data-disabled:text-muted transition focus-visible:ring-primary m-0.5 rounded-full data-unavailable:line-through data-unavailable:text-muted data-unavailable:pointer-events-none data-today:font-semibold data-[outside-view]:text-muted size-8 data-[selected]:bg-primary data-[selected]:text-inverted data-today:not-data-[selected]:text-primary data-[highlighted]:bg-primary/20 hover:not-data-[selected]:bg-primary/20">8</div>
           </td>
         </tr>
       </tbody>
diff --git a/test/nuxt/setup.ts b/test/nuxt/setup.ts
index c3ecf6a93e..3c65e062c6 100644
--- a/test/nuxt/setup.ts
+++ b/test/nuxt/setup.ts
@@ -19,4 +19,49 @@ configureAxe({
   }
 })
 
+function createStorageMock() {
+  const store = new Map<string, string>()
+
+  return {
+    get length() {
+      return store.size
+    },
+    clear() {
+      store.clear()
+    },
+    getItem(key: string) {
+      return store.get(key) ?? null
+    },
+    key(index: number) {
+      return Array.from(store.keys())[index] ?? null
+    },
+    removeItem(key: string) {
+      store.delete(key)
+    },
+    setItem(key: string, value: string) {
+      store.set(key, String(value))
+    }
+  }
+}
+
+const storage = createStorageMock()
+
+if (typeof window !== 'undefined') {
+  const localStorage = window.localStorage
+
+  if (!localStorage || typeof localStorage.getItem !== 'function' || typeof localStorage.setItem !== 'function') {
+    Object.defineProperty(window, 'localStorage', {
+      value: storage,
+      configurable: true
+    })
+  }
+}
+
+if (typeof globalThis.localStorage === 'undefined' || typeof globalThis.localStorage.getItem !== 'function' || typeof globalThis.localStorage.setItem !== 'function') {
+  Object.defineProperty(globalThis, 'localStorage', {
+    value: storage,
+    configurable: true
+  })
+}
+
 expect.extend(matchers)
diff --git a/test/utils/setup.ts b/test/utils/setup.ts
index 93adebdb53..d6d59354bc 100644
--- a/test/utils/setup.ts
+++ b/test/utils/setup.ts
@@ -12,6 +12,47 @@ window.IntersectionObserver = class IntersectionObserver {
   disconnect() {}
 }
 
+function createStorageMock() {
+  const store = new Map<string, string>()
+
+  return {
+    get length() {
+      return store.size
+    },
+    clear() {
+      store.clear()
+    },
+    getItem(key: string) {
+      return store.get(key) ?? null
+    },
+    key(index: number) {
+      return Array.from(store.keys())[index] ?? null
+    },
+    removeItem(key: string) {
+      store.delete(key)
+    },
+    setItem(key: string, value: string) {
+      store.set(key, String(value))
+    }
+  }
+}
+
+const storage = createStorageMock()
+
+if (!window.localStorage || typeof window.localStorage.getItem !== 'function' || typeof window.localStorage.setItem !== 'function') {
+  Object.defineProperty(window, 'localStorage', {
+    value: storage,
+    configurable: true
+  })
+}
+
+if (typeof globalThis.localStorage === 'undefined' || typeof globalThis.localStorage.getItem !== 'function' || typeof globalThis.localStorage.setItem !== 'function') {
+  Object.defineProperty(globalThis, 'localStorage', {
+    value: storage,
+    configurable: true
+  })
+}
+
 configureAxe({
   globalOptions: {
     rules: [{