calendar-simple 1.2.0 → 2.0.0-beta.1

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2026 jaganath-m-s
+Copyright (c) 2024-2026 jaganath-m-s
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -1,26 +1,41 @@
 # Calendar Simple
 
-![npm](https://img.shields.io/npm/v/calendar-simple)
-![npm bundle size](https://img.shields.io/bundlephobia/minzip/calendar-simple)
-![npm downloads](https://img.shields.io/npm/dm/calendar-simple)
-![license](https://img.shields.io/npm/l/calendar-simple)
+[![npm version](https://img.shields.io/npm/v/calendar-simple)](https://www.npmjs.com/package/calendar-simple)
+[![bundle size](https://img.shields.io/npm/unpacked-size/calendar-simple)](https://www.npmjs.com/package/calendar-simple)
+[![npm downloads](https://img.shields.io/npm/dm/calendar-simple)](https://www.npmjs.com/package/calendar-simple)
+[![license](https://img.shields.io/npm/l/calendar-simple)](https://github.com/Jaganath-MSJ/CalendarSimple/blob/main/LICENSE)
 
-A lightweight, customizable, and responsive calendar component for React applications. Built with TypeScript and Day.js, `calendar-simple` provides a flexible solution for date selection and event management in your React projects.
+A lightweight, customizable, and accessible calendar component for React. Built with TypeScript and Luxon.
 
-**[Live Demo](http://calendarsimple.netlify.app)**
+**[Live Demo](https://calendarsimple.netlify.app)**
 
 ## Features
 
-- **📅 Month View**: Intuitive navigation through monthly views.
-- **✨ Event Handling**: Built-in support for displaying and managing events with custom colors.
-- **📱 Responsive**: Automatically adjusts layout based on container dimensions.
-- **🎨 Theming**: Fully customizable colors for selected dates, current day, and general theme.
-- **👆 Interactive**: granular control with click handlers for dates, specific events, and "more" indicators.
-- **🛡️ TypeScript**: Written in TypeScript for robust type safety and developer experience.
+- **🗓️ Multiple Views** — Month, Week, Day, Schedule, and Custom Days views.
+- **✨ Event Handling** — Display and manage events with custom styling and arbitrary metadata.
+- **📱 Responsive** — Built-in CSS breakpoints at 768px (tablet) and 480px (phone).
+- **🎨 Theming & Customization** — Override colors via `theme` and inject CSS classes via `classNames`.
+- **🌙 Dark Mode & Color Schemes** — Built-in light/dark palettes with OS auto-detection.
+- **🌐 RTL Support** — Full right-to-left layout with auto-detection for Arabic, Hebrew, Farsi, and more.
+- **🧩 Custom Renderers** — Replace events, headers, and grid cells with your own React components.
+- **⌨️ Keyboard Navigation** — Enter/Space activation, Tab focus trap in popovers, Escape to close.
+- **♿ Accessibility** — Semantic HTML, ARIA roles, labels, and screen reader support throughout.
+- **🕒 Time Formatting** — 12-hour (AM/PM) and 24-hour formats with a live current-time indicator.
+- **👆 Interactive** — Click handlers for dates, events, "+more" indicators, and empty slot creation.
+- **🌍 Localization** — Full i18n via Luxon locale codes and custom UI message translations.
+- **🛡️ TypeScript** — Fully typed props, callbacks, and interfaces — all exported.
 
-## Installation
+## Requirements
+
+| Dependency | Version                   |
+| ---------- | ------------------------- |
+| React      | ≥ 19.0                    |
+| React DOM  | ≥ 19.0                    |
+| Node.js    | ≥ 18 LTS (build/dev only) |
+
+Luxon is bundled as a direct dependency — no separate install needed.
 
-Install using your preferred package manager:
+## Installation
 
 ```bash
 npm install calendar-simple
@@ -34,122 +49,416 @@ pnpm add calendar-simple
 
 ### Basic Example
 
-Import the component and its styles to get started:
-
 ```tsx
 import React, { useState } from "react";
-import Calendar, { CalendarType } from "calendar-simple";
+import Calendar from "calendar-simple";
 import "calendar-simple/dist/styles.css";
 
 const App = () => {
   const [selectedDate, setSelectedDate] = useState(new Date());
 
+  // Calendar fills its container — give the parent an explicit height
   return (
     <div style={{ height: "600px", padding: "20px" }}>
       <Calendar
         selectedDate={selectedDate}
         onDateClick={setSelectedDate}
-        isSelectDate
+        selectable
       />
     </div>
   );
 };
 ```
 
-### Advanced Usage with Events & Theme
+### Advanced Usage with Events & Views
 
 ```tsx
 import React, { useState } from "react";
-import Calendar, { DataType } from "calendar-simple";
+import Calendar, { CalendarEvent, ECalendarViewType } from "calendar-simple";
 import "calendar-simple/dist/styles.css";
 
 const MyCalendar = () => {
   const [selectedDate, setSelectedDate] = useState(new Date());
+  const [view, setView] = useState<ECalendarViewType>("month");
 
-  const events: DataType[] = [
+  const events: CalendarEvent[] = [
     {
+      id: "1",
       startDate: "2024-02-14",
-      value: "Valentine's Day",
-      color: "#ffcccc",
+      title: "Valentine's Day",
+      style: { backgroundColor: "#ffcccc" },
     },
     {
+      id: "2",
       startDate: "2024-02-20",
       endDate: "2024-02-22",
-      value: "Tech Conference",
-      color: "#e6f7ff",
+      title: "Tech Conference",
+      style: { backgroundColor: "#e6f7ff" },
+    },
+    {
+      id: "3",
+      startDate: "2024-02-21T10:00:00",
+      endDate: "2024-02-21T12:00:00",
+      title: "Team Meeting",
+      style: { backgroundColor: "#cce5ff" },
     },
   ];
 
   return (
     <Calendar
+      events={events}
       selectedDate={selectedDate}
+      view={view}
       onDateClick={setSelectedDate}
-      isSelectDate
-      data={events}
-      width={800}
-      height={600}
+      onViewChange={setView}
+      selectable
+      is12Hour
+      showCurrentTime
+      autoScrollToCurrentTime
       theme={{
         selected: { color: "#fff", bgColor: "#007bff" },
         today: { color: "#007bff", bgColor: "#e6f2ff" },
       }}
-      onEventClick={(event) => alert(`Clicked: ${event.value}`)}
+      onEventClick={(event) => alert(`Clicked: ${event.title}`)}
     />
   );
 };
 ```
 
+### 🧩 Custom Renderers
+
+```tsx
+<Calendar
+  renderEvent={(event) => (
+    <div
+      style={{
+        padding: "2px",
+        backgroundColor: "#e0f2fe",
+        borderRadius: "4px",
+      }}
+    >
+      <strong>🚀 {event.title}</strong>
+    </div>
+  )}
+  renderHeader={({ currentDate, onNavigate }) => (
+    <div
+      style={{
+        display: "flex",
+        justifyContent: "space-between",
+        padding: "10px",
+      }}
+    >
+      <button
+        onClick={() => {
+          const d = new Date(currentDate);
+          d.setMonth(d.getMonth() - 1);
+          onNavigate(d);
+        }}
+      >
+        Prev
+      </button>
+      <h2>
+        {currentDate.toLocaleDateString("default", {
+          month: "long",
+          year: "numeric",
+        })}
+      </h2>
+      <button
+        onClick={() => {
+          const d = new Date(currentDate);
+          d.setMonth(d.getMonth() + 1);
+          onNavigate(d);
+        }}
+      >
+        Next
+      </button>
+    </div>
+  )}
+/>
+```
+
+### 🌍 Localization
+
+```tsx
+<Calendar
+  locale="fr"
+  localeMessages={{
+    today: "Aujourd'hui",
+    day: "Jour",
+    week: "Semaine",
+    month: "Mois",
+    schedule: "Planning",
+    days: "Jours",
+  }}
+/>
+```
+
 ## API Reference
 
+> For full prop descriptions and usage examples, see [FEATURES.md](./FEATURES.md).
+
 ### Props
 
-| Prop               | Type                        | Description                                                | Default         |
-| ------------------ | --------------------------- | ---------------------------------------------------------- | --------------- |
-| `data`             | `DataType[]`                | Array of event data objects to display.                    | `[]`            |
-| `selectedDate`     | `Date`                      | The currently selected date object.                        | `undefined`     |
-| `onDateClick`      | `(date: Date) => void`      | Callback function fired when a date is clicked.            | `undefined`     |
-| `onEventClick`     | `(event: DataType) => void` | Callback function fired when an event is clicked.          | `undefined`     |
-| `onMoreClick`      | `(date: Date) => void`      | Callback fired when the "+X more" indicator is clicked.    | `undefined`     |
-| `onMonthChange`    | `(date: Date) => void`      | Callback fired when the visible month is changed.          | `undefined`     |
-| `width`            | `number`                    | Width of the calendar container in pixels.                 | `400`           |
-| `height`           | `number`                    | Height of the calendar container in pixels.                | `400`           |
-| `theme`            | `CalendarTheme`             | Configuration object for custom colors.                    | `Default Theme` |
-| `dayType`          | `EDayType`                  | Format for day names: `"FULL"` (Monday) or `"HALF"` (Mon). | `HALF`          |
-| `isSelectDate`     | `boolean`                   | Enables visual selection state.                            | `false`         |
-| `pastYearLength`   | `number`                    | Number of past years to show in the year dropdown.         | `5`             |
-| `futureYearLength` | `number`                    | Number of future years to show in the year dropdown.       | `5`             |
-| `maxEvents`        | `number`                    | Maximum events to show per day cell before collapsing.     | Auto-calc       |
+| Prop                      | Type                                                          | Default             |
+| ------------------------- | ------------------------------------------------------------- | ------------------- |
+| `events`                  | `CalendarEvent[]`                                             | `[]`                |
+| `selectedDate`            | `Date`                                                        | `undefined`         |
+| `view`                    | `ECalendarViewType`                                           | `"month"`           |
+| `testId`                  | `string`                                                      | `undefined`         |
+| `isLoading`               | `boolean`                                                     | `undefined`         |
+| `renderLoading`           | `() => ReactNode`                                             | `undefined`         |
+| `selectable`              | `boolean`                                                     | `false`             |
+| `creatable`               | `boolean`                                                     | `false`             |
+| `is12Hour`                | `boolean`                                                     | `false`             |
+| `colorScheme`             | `'light' \| 'dark' \| 'auto'`                                 | `'auto'`            |
+| `direction`               | `'ltr' \| 'rtl'`                                              | `` `auto-detect` `` |
+| `locale`                  | `string`                                                      | `'en'`              |
+| `localeMessages`          | `object`                                                      | `{}`                |
+| `theme`                   | `CalendarTheme`                                               | `{}`                |
+| `classNames`              | `CalendarClassNames`                                          | `{}`                |
+| `width`                   | `number \| string`                                            | `` `auto` ``        |
+| `height`                  | `number \| string`                                            | `` `auto` ``        |
+| `dayType`                 | `EDayType`                                                    | `"half"`            |
+| `weekStartsOn`            | `number`                                                      | `0`                 |
+| `weekEndsOn`              | `number`                                                      | `6`                 |
+| `customDays`              | `number`                                                      | `3`                 |
+| `showAdjacentMonths`      | `boolean`                                                     | `true`              |
+| `showWeekNumbers`         | `boolean`                                                     | `false`             |
+| `showAllDayRow`           | `boolean`                                                     | `true`              |
+| `maxEvents`               | `number`                                                      | `` `auto` ``        |
+| `minHour`                 | `number`                                                      | `0`                 |
+| `maxHour`                 | `number`                                                      | `24`                |
+| `eventOverlapOffset`      | `number`                                                      | `0`                 |
+| `showCurrentTime`         | `boolean`                                                     | `false`             |
+| `autoScrollToCurrentTime` | `boolean`                                                     | `false`             |
+| `resetDateOnViewChange`   | `boolean`                                                     | `false`             |
+| `pastYearLength`          | `number`                                                      | `5`                 |
+| `futureYearLength`        | `number`                                                      | `5`                 |
+| `onDateClick`             | `(date: Date) => void`                                        | `undefined`         |
+| `onEventClick`            | `(event: CalendarEvent) => void`                              | `undefined`         |
+| `onMoreClick`             | `(date: Date, hiddenEvents?: CalendarEvent[]) => void`        | `undefined`         |
+| `onNavigate`              | `(date: Date) => void`                                        | `undefined`         |
+| `onViewChange`            | `(view: ECalendarViewType) => void`                           | `undefined`         |
+| `onSlotClick`             | `(startDate: Date, endDate: Date) => void`                    | `undefined`         |
+| `renderEvent`             | `(event: CalendarEvent) => ReactNode`                         | `undefined`         |
+| `renderHeader`            | `(props: RenderHeaderProps) => ReactNode`                     | `undefined`         |
+| `renderHourCell`          | `(date: Date) => ReactNode`                                   | `undefined`         |
+| `renderDateCell`          | `(props: RenderDateCellProps) => ReactNode`                   | `undefined`         |
+| `renderScheduleSeparator` | `(date: Date) => ReactNode`                                   | `undefined`         |
+| `enableEnrichedEvents`    | `boolean`                                                     | `false`             |
+| `enrichedEventsByDate`    | `Record<string, CalendarEvent[]>`                             | `undefined`         |
+| `eventsAreSorted`         | `boolean`                                                     | `false`             |
+| `isEventOrderingEnabled`  | `boolean`                                                     | `true`              |
+| `sortedMonthView`         | `boolean \| ((a: CalendarEvent, b: CalendarEvent) => number)` | `true`              |
 
 ### Types
 
-#### `DataType`
+#### `CalendarEvent`
 
 ```typescript
-interface DataType {
-  startDate: string; // Format: YYYY-MM-DD
-  endDate?: string; // Format: YYYY-MM-DD
-  value: string; // Event title or description
-  color?: string; // CSS color string for event background
+interface CalendarEvent {
+  id?: string;
+  startDate: string; // YYYY-MM-DD or YYYY-MM-DDTHH:mm:ss
+  endDate?: string;
+  title: string;
+  style?: CSSProperties;
+  [key: string]: unknown; // custom metadata fields
 }
 ```
 
+#### `ECalendarViewType` & `EDayType`
+
+```typescript
+type ECalendarViewType = "month" | "week" | "day" | "schedule" | "customDays";
+type EDayType = "full" | "half";
+```
+
 #### `CalendarTheme`
 
 ```typescript
-interface CalendarTheme {
-  selected?: {
-    color?: string; // Text color for selected date
-    bgColor?: string; // Background color for selected date
-  };
-  today?: {
-    color?: string; // Text color for today's date
-    bgColor?: string; // Background color for today's date
-  };
+interface ThemeStyle {
+  color?: string; // Text / foreground color
+  bgColor?: string; // Background color
+}
+
+interface ThemeScheme {
+  default?: ThemeStyle;
+  selected?: ThemeStyle;
+  today?: ThemeStyle;
+}
+
+interface CalendarTheme extends ThemeScheme {
+  dark?: ThemeScheme; // Overrides applied only when resolved scheme is "dark"
+  light?: ThemeScheme; // Overrides applied only when resolved scheme is "light"
+}
+```
+
+#### `RenderHeaderProps`
+
+```typescript
+interface RenderHeaderProps {
+  currentDate: Date;
+  view: ECalendarViewType;
+  onNavigate: (date: Date) => void;
+  onViewChange: (view: ECalendarViewType) => void;
 }
 ```
 
+#### `RenderDateCellProps`
+
+```typescript
+interface RenderDateCellProps {
+  date: Date;
+  isToday: boolean;
+  isSelected?: boolean;
+  isCurrentMonth?: boolean;
+}
+```
+
+#### `CalendarClassNames`
+
+```typescript
+interface CalendarClassNames {
+  root?: string;
+  header?: string;
+
+  // Month view
+  table?: string;
+  tableHeader?: string;
+  tableDate?: string;
+  weekNumber?: string;
+
+  // Shared events
+  event?: string;
+  selected?: string;
+  today?: string;
+
+  // Week & Day view
+  dayHeader?: string;
+  dayName?: string;
+  dayNumber?: string;
+  timeColumn?: string;
+  timeSlot?: string;
+  dayColumn?: string;
+
+  // Schedule view
+  scheduleDateGroup?: string;
+  scheduleDateNumber?: string;
+  scheduleDateSubInfo?: string;
+  scheduleTime?: string;
+  scheduleTitle?: string;
+}
+```
+
+## Configuration
+
+### Color Scheme
+
+```tsx
+// Follow OS preference (default)
+<Calendar colorScheme="auto" />
+
+// Force dark mode
+<Calendar colorScheme="dark" />
+
+// Force light mode
+<Calendar colorScheme="light" />
+```
+
+Override individual CSS custom properties for fine-grained control:
+
+```css
+[data-color-scheme="dark"] {
+  --primary-bg: #1a1a1a;
+  --primary-text: #ffffff;
+  --accent-color: #818cf8;
+}
+```
+
+### Theme Colors
+
+```tsx
+<Calendar
+  theme={{
+    today: { color: "#007bff", bgColor: "#e6f2ff" },
+    selected: { color: "#fff", bgColor: "#007bff" },
+  }}
+/>
+```
+
+### RTL Layout
+
+```tsx
+// Auto-detected for Arabic, Hebrew, Farsi, Urdu, and more
+<Calendar locale="ar" />
+
+// Manual override
+<Calendar direction="rtl" />
+```
+
+### Custom CSS Classes
+
+```tsx
+<Calendar
+  classNames={{
+    root: "my-calendar",
+    event: "my-event-chip",
+    header: "my-header",
+  }}
+/>
+```
+
+> See [FEATURES.md](./FEATURES.md) for the full `classNames` key list and Props Reference.
+
+## Responsive & Mobile
+
+Built-in CSS breakpoints adapt the layout at **768px** (tablet) and **480px** (phone) with no extra configuration. Drop the `width` prop and let the parent container control sizing for breakpoints to activate naturally.
+
+See [FEATURES.md — Responsive Layout](./FEATURES.md#responsive-layout) for the full breakpoint table.
+
+## Changelog
+
+All notable changes are tracked via [GitHub Releases](https://github.com/Jaganath-MSJ/CalendarSimple/releases).
+
+## FAQ
+
+**Why aren't my breakpoints activating?**
+CSS breakpoints fire based on _viewport_ width when an explicit `width` prop is passed. Drop the `width` prop and let the parent container control sizing for container-relative behaviour.
+
+**How do I show only work hours (e.g. 9–17)?**
+Use `minHour={9}` and `maxHour={17}` to hide hours outside that range in Day and Week views.
+
+**Do I need to install Luxon separately?**
+No — Luxon is a direct dependency bundled inside `calendar-simple`.
+
+**How do I pre-populate the selected date?**
+Pass a JavaScript `Date` object to the `selectedDate` prop and update it via `onDateClick`.
+
+**Why does RTL not activate when I set `locale="ar"`?**
+If you also pass `direction="ltr"` explicitly, that overrides auto-detection. Remove the `direction` prop to allow auto-detection to work.
+
 ## Contributing
 
-Contributions are welcome! Please feel free to submit a Pull Request.
+Contributions are welcome! Here's how to get started:
+
+1. **Fork** the repository and create a branch from `dev`:
+   ```bash
+   git checkout -b feat/your-feature-name dev
+   ```
+2. **Install dependencies:**
+   ```bash
+   npm install
+   ```
+3. **Run the dev environment:**
+   ```bash
+   npm run storybook   # Component explorer on http://localhost:6006
+   npm run test:watch  # Tests in watch mode
+   ```
+4. **Make your changes** — follow the existing TypeScript and CSS Module patterns.
+5. **Add or update tests** — new behaviour must be covered.
+6. **Submit a Pull Request** to the `dev` branch with a clear description of the change.
+
+Please follow [Conventional Commits](https://www.conventionalcommits.org/) for commit messages (`feat:`, `fix:`, `docs:`, etc.).
 
 ## License
 

package/dist/calendar-simple.css

@@ -1,2 +1,2 @@
-._calendarContainer_q5rnf_1{justify-content:center;align-items:center;width:100%;height:100%;display:flex}._calendar_q5rnf_1{--calendar-width:0px;--calendar-height:0px;--primary-color:#3b82f6;--primary-hover:#2563eb;--text-primary:#1f2937;--text-secondary:#6b7280;--bg-color:#fff;--bg-hover:#f3f4f6;--border-color:#e5e7eb;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--radius-md:.375rem;--radius-lg:.5rem;width:100%;height:100%;color:var(--text-primary);background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);box-sizing:border-box;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,Arial,sans-serif;overflow:hidden auto}._calendar_q5rnf_1 *{box-sizing:border-box;margin:0;padding:0}._table_q5rnf_56{border-collapse:separate;border-spacing:0}._tableHeader_q5rnf_61,._tableCell_q5rnf_62{border-right:1px solid var(--border-color);border-bottom:1px solid var(--border-color)}._tableHeader_q5rnf_61:last-child,._tableCell_q5rnf_62:last-child{border-right:none}._table_q5rnf_56 tr:last-child ._tableCell_q5rnf_62{border-bottom:none}._tableHeader_q5rnf_61{height:40px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;text-align:center;vertical-align:middle;background-color:#f9fafb;font-size:.875rem;font-weight:600}._tableBody_q5rnf_88{height:var(--calendar-height)}._dateData_ed04n_1{cursor:pointer;vertical-align:top;height:calc(var(--calendar-height) / var(--calendar-rows,6));min-width:calc(var(--calendar-width) / 7);max-width:calc(var(--calendar-width) / 7);padding:.25rem;transition:background-color .15s;position:relative}._dateData_ed04n_1:hover{background-color:#fafafa}._currentMonth_ed04n_18{color:#9ca3af;background-color:#f9fafb}._cellContent_ed04n_23{flex-direction:column;justify-content:flex-start;gap:.25rem;width:100%;height:100%;display:flex}._dateLabel_ed04n_32{width:1.75rem;height:1.75rem;color:var(--text-primary);border-radius:50%;justify-content:center;align-items:center;margin-bottom:.25rem;padding:.25rem;font-size:.875rem;font-weight:500;display:flex}._selected_ed04n_46 ._dateLabel_ed04n_32,._today_ed04n_51 ._dateLabel_ed04n_32{background-color:var(--primary-color);color:#fff}._dataContainer_ed04n_56{flex-direction:column;flex:1;gap:2px;display:flex;overflow:visible}._spacer_ed04n_64{height:1.5rem;margin-bottom:2px}._eventItem_ed04n_69{background-color:var(--primary-color);z-index:2;white-space:nowrap;text-overflow:ellipsis;color:#fff;box-sizing:border-box;cursor:pointer;border-radius:4px;height:1.5rem;padding:.15rem .5rem;font-size:.75rem;font-weight:500;line-height:1.2rem;transition:transform .1s,box-shadow .1s;position:relative;overflow:hidden;box-shadow:0 1px 2px #0000001a}._eventItem_ed04n_69:hover{filter:brightness(1.05);transform:translateY(-1px);box-shadow:0 2px 4px #00000026}._moreEventsContainer_ed04n_97{margin-top:2px;position:relative}._moreEvents_ed04n_97{color:var(--text-secondary);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:4px;width:100%;padding:.15rem .5rem;font-size:.75rem;font-weight:600;transition:background-color .2s}._moreEvents_ed04n_97:hover{background-color:var(--bg-hover);color:var(--text-primary)}._popover_5fy95_1{z-index:100;border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);opacity:0;background-color:#fff;flex-direction:column;gap:2px;min-width:200px;max-width:300px;max-height:300px;padding:.5rem;animation:.2s forwards _fadeIn_5fy95_1;display:flex;position:fixed;top:calc(100% + 4px);left:0;overflow-y:auto}@keyframes _fadeIn_5fy95_1{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}._popoverHeader_5fy95_34{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border-color);margin-bottom:.5rem;padding-bottom:.25rem;font-size:.75rem;font-weight:600}._popoverContent_5fy95_45{overflow-y:auto}._popoverItem_5fy95_49{background-color:var(--primary-color);color:#fff;border-radius:var(--radius-md);white-space:nowrap;text-overflow:ellipsis;cursor:pointer;flex-shrink:0;margin-bottom:2px;padding:.25rem .5rem;font-size:.75rem;transition:opacity .2s;overflow:hidden}._popoverItem_5fy95_49:hover{opacity:.9}._popoverItem_5fy95_49._startBefore_5fy95_68{clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%);border-top-left-radius:0;border-bottom-left-radius:0;padding-left:14px}._popoverItem_5fy95_49._endAfter_5fy95_75{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%);border-top-right-radius:0;border-bottom-right-radius:0;padding-right:14px}._popoverItem_5fy95_49._startBefore_5fy95_68._endAfter_5fy95_75{clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);border-radius:0;padding-left:14px;padding-right:14px}._header_7f1ps_1{box-sizing:border-box;background-color:#0000;justify-content:space-between;align-items:center;width:100%;padding:1rem;display:flex}._navigation_7f1ps_11{align-items:center;gap:1rem;display:flex}._todayButton_7f1ps_17{border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;background-color:#0000;padding:.5rem 1rem;font-family:inherit;font-size:.875rem;font-weight:500;transition:all .2s}._todayButton_7f1ps_17:hover{background-color:var(--bg-hover);border-color:var(--text-secondary)}._arrows_7f1ps_35{align-items:center;gap:.5rem;display:flex}._iconButton_7f1ps_41{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;background:0 0;border:1px solid #0000;outline:none;justify-content:center;align-items:center;width:2rem;height:2rem;transition:all .2s;display:flex}._iconButton_7f1ps_41:hover{background-color:var(--bg-hover);color:var(--text-primary)}._dateTitle_7f1ps_61{color:var(--text-primary);white-space:nowrap;margin:0;font-family:inherit;font-size:1.25rem;font-weight:600}._controls_7f1ps_70{align-items:center;gap:.75rem;display:flex}._select_7f1ps_76{-webkit-appearance:none;appearance:none;background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;outline:none;padding:.5rem 2.5rem .5rem 1rem;font-family:inherit;font-size:.875rem;transition:border-color .2s}._select_7f1ps_76:hover{border-color:var(--text-secondary)}._select_7f1ps_76:focus{border-color:var(--primary-color);box-shadow:0 0 0 2px #3b82f633}
+._calendar_1250h_1{--calendar-width:0px;--calendar-height:0px;width:100%;height:100%;color:var(--text-primary);background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);box-sizing:border-box;flex-direction:column;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,Arial,sans-serif;display:flex;overflow:hidden}._calendar_1250h_1 *{box-sizing:border-box;margin:0;padding:0}._header_1fovk_1{box-sizing:border-box;background-color:#0000;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;width:100%;padding:1rem;display:flex}@media (max-width:768px){._header_1fovk_1{flex-direction:column;align-items:flex-start;gap:.5rem;padding:.75rem}._navigation_1fovk_21{justify-content:space-between;width:100%}._controls_1fovk_26{flex-wrap:wrap;justify-content:flex-start;gap:.5rem;width:100%}._dateTitle_1fovk_33{font-size:1rem}._select_1fovk_37{padding-block-start:.375rem;padding-block-end:.375rem;padding-inline-start:.75rem;padding-inline-end:2rem;font-size:.8125rem}._todayButton_1fovk_43{padding:.375rem .75rem;font-size:.8125rem}}._navigation_1fovk_21{align-items:center;gap:1rem;display:flex}._todayButton_1fovk_43{border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;background-color:#0000;padding:.5rem 1rem;font-family:inherit;font-size:.875rem;font-weight:500;transition:all .2s}._todayButton_1fovk_43:hover{background-color:var(--bg-hover);border-color:var(--text-secondary)}._arrows_1fovk_73{align-items:center;gap:.5rem;display:flex}._iconButton_1fovk_79{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;background:0 0;border:1px solid #0000;outline:none;justify-content:center;align-items:center;width:2rem;height:2rem;transition:all .2s;display:flex}._iconButton_1fovk_79:hover{background-color:var(--bg-hover);color:var(--text-primary)}._dateTitle_1fovk_33{color:var(--text-primary);white-space:nowrap;margin:0;font-family:inherit;font-size:1.25rem;font-weight:600}._controls_1fovk_26{align-items:center;gap:.75rem;display:flex}._select_1fovk_37{-webkit-appearance:none;appearance:none;background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;outline:none;padding-block-start:.5rem;padding-block-end:.5rem;padding-inline-start:1rem;padding-inline-end:2.5rem;font-family:inherit;font-size:.875rem;transition:border-color .2s}._select_1fovk_37:hover{border-color:var(--text-secondary)}._select_1fovk_37:focus{border-color:var(--primary-color);box-shadow:0 0 0 2px #3b82f633}[dir=rtl] ._select_1fovk_37{background-position:.5rem}._iconButtonIcon_1fovk_146{justify-content:center;align-items:center;display:inline-flex}[dir=rtl] ._iconButtonIcon_1fovk_146{transform:scaleX(-1)}._dayView_1jv91_1{border:1px solid var(--border-color);border-radius:8px;flex-direction:column;height:100%;display:flex;overflow:auto}._stickyTopContainer_1jv91_11{z-index:20;background-color:var(--bg-color);flex-direction:column;display:flex;position:sticky;top:0;box-shadow:0 4px 6px -4px #0000001a}._dayHeaderContainer_1jv91_21{border-bottom:1px solid var(--border-color);background-color:var(--bg-hover);display:flex}._timeHeaderSpacer_1jv91_27{border-inline-end:1px solid var(--border-color);z-index:15;background-color:var(--bg-hover);flex-shrink:0;width:60px;position:sticky}._timeHeaderSpacer_1jv91_27:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeHeaderSpacer_1jv91_27:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeHeaderSpacer_1jv91_27:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._timeHeaderSpacer_1jv91_27:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._dayHeader_1jv91_21{text-align:center;flex:1;padding:10px 0}._dayName_1jv91_43{color:var(--text-secondary);text-transform:uppercase;font-size:12px}._dayNumber_1jv91_49{margin-top:4px;font-size:20px;font-weight:500}._dayNumber_1jv91_49._today_1jv91_55{color:var(--primary-color);font-weight:700}._timeGrid_1jv91_60{flex:1;grid-template-columns:60px 1fr;display:grid}._eventsColumn_1jv91_67{position:relative}@media (max-width:768px){._dayNumber_1jv91_49{margin-top:2px;font-size:16px}._dayHeader_1jv91_21{padding:6px 0}}._timeColumn_4fa67_1{border-inline-end:1px solid var(--border-color);z-index:5;background-color:var(--bg-color);flex-shrink:0;width:60px;position:sticky}._timeColumn_4fa67_1:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeColumn_4fa67_1:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeColumn_4fa67_1:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._timeColumn_4fa67_1:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._timeSlot_4fa67_11{border-bottom:1px solid var(--border-color);height:60px;color:var(--text-secondary);justify-content:center;align-items:center;font-size:12px;display:flex}._eventItem_16dg8_1{color:#fff;cursor:pointer;box-sizing:border-box;width:calc(var(--event-width) - 2px);background-color:#3b82f6;border-radius:4px;flex-direction:column;padding:4px 5px;font-size:12px;line-height:1.2;display:flex;position:absolute;left:5px;right:5px;overflow:hidden}._eventItemSmall_16dg8_19{flex-direction:row;align-items:center;gap:4px;padding:2px 5px}._eventItemTiny_16dg8_26{flex-direction:row;align-items:center;gap:4px;padding:1px 4px;font-size:10px;line-height:1}._eventTitle_16dg8_35{white-space:nowrap;text-overflow:ellipsis;font-weight:500;overflow:hidden}._eventTime_16dg8_42{white-space:nowrap;text-overflow:ellipsis;opacity:.9;overflow:hidden}._currentTimeLine_1e39r_1{z-index:10;pointer-events:none;align-items:center;height:2px;display:flex;position:absolute;left:0;right:0}._circle_1e39r_11{background-color:#ea4335;border-radius:50%;width:12px;height:12px;position:absolute}._circle_1e39r_11:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:-6px}._circle_1e39r_11:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:-6px}._circle_1e39r_11:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:-6px}._circle_1e39r_11:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:-6px}._line_1e39r_20{background-color:#ea4335;width:100%;height:2px}._eventSlot_sn2kl_1{border-bottom:1px solid var(--border-color);height:60px}._creatable_sn2kl_6{cursor:pointer}._bannerWrapper_kxvmv_1{border-bottom:1px solid var(--border-color);width:100%;display:flex}._timeHeaderSpacer_kxvmv_7{border-inline-end:1px solid var(--border-color);z-index:15;background-color:var(--bg-color);flex-direction:column;flex-shrink:0;justify-content:space-between;align-items:center;width:60px;padding:4px 0 2px;display:flex;position:sticky}._timeHeaderSpacer_kxvmv_7:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeHeaderSpacer_kxvmv_7:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeHeaderSpacer_kxvmv_7:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._timeHeaderSpacer_kxvmv_7:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._timezoneLabel_kxvmv_22{color:var(--text-secondary);text-align:center;margin-top:4px;font-size:10px;font-weight:500}._expandIcon_kxvmv_30{cursor:pointer;width:24px;height:24px;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;transition:background-color .2s,transform .2s;display:flex}._expandIcon_kxvmv_30:hover{background-color:var(--bg-hover)}._expandIcon_kxvmv_30._expanded_kxvmv_48{transform:rotate(180deg)}._bannerContainer_kxvmv_52{box-sizing:border-box;flex-direction:column;flex:1 0;min-height:28px;padding-bottom:4px;display:flex;position:relative;overflow:hidden}._bannerGridBg_kxvmv_64{pointer-events:none;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}._bannerGridCell_kxvmv_74{border-inline-end:1px solid var(--border-color);flex:1}._bannerGridCell_kxvmv_74:last-child{border-inline-end:none}._bannerRow_kxvmv_83{width:100%;height:22px;margin-top:2px;position:relative}._bannerChip_kxvmv_90{color:#fff;box-sizing:border-box;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;z-index:10;background-color:#1a73e8;border-radius:4px;align-items:center;height:20px;padding:0 4px;font-size:11px;font-weight:500;display:flex;position:absolute;top:1px;overflow:hidden}._bannerChip_kxvmv_90._clippedLeft_kxvmv_110{clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%);padding-inline-start:14px}._bannerChip_kxvmv_90._clippedLeft_kxvmv_110:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-left-radius:0;border-bottom-left-radius:0}._bannerChip_kxvmv_90._clippedLeft_kxvmv_110:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-left-radius:0;border-bottom-left-radius:0}._bannerChip_kxvmv_90._clippedLeft_kxvmv_110:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-right-radius:0;border-bottom-right-radius:0}._bannerChip_kxvmv_90._clippedLeft_kxvmv_110:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-right-radius:0;border-bottom-right-radius:0}._bannerChip_kxvmv_90._clippedRight_kxvmv_117{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%);padding-inline-end:14px}._bannerChip_kxvmv_90._clippedRight_kxvmv_117:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-right-radius:0;border-bottom-right-radius:0}._bannerChip_kxvmv_90._clippedRight_kxvmv_117:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-right-radius:0;border-bottom-right-radius:0}._bannerChip_kxvmv_90._clippedRight_kxvmv_117:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-left-radius:0;border-bottom-left-radius:0}._bannerChip_kxvmv_90._clippedRight_kxvmv_117:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-left-radius:0;border-bottom-left-radius:0}._bannerChip_kxvmv_90._clippedLeft_kxvmv_110._clippedRight_kxvmv_117{clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);border-radius:0;padding-inline-start:14px;padding-inline-end:14px}[dir=rtl] ._bannerChip_kxvmv_90._clippedLeft_kxvmv_110{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%)}[dir=rtl] ._bannerChip_kxvmv_90._clippedRight_kxvmv_117{clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%)}._title_kxvmv_157{text-overflow:ellipsis;white-space:nowrap;flex-grow:1;overflow:hidden}._moreChip_kxvmv_164{color:var(--text-secondary);box-sizing:border-box;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;z-index:10;background:0 0;border-radius:4px;align-items:center;padding:.15rem .5rem;font-size:.75rem;font-weight:600;transition:background-color .2s;display:flex;position:absolute;overflow:hidden}._moreChip_kxvmv_164:hover{background-color:var(--bg-hover);color:var(--text-primary)}._weekView_17rc6_1{border:1px solid var(--border-color);border-radius:8px;flex-direction:column;height:100%;display:flex;overflow:auto}._stickyTopContainer_17rc6_11{z-index:20;background-color:var(--bg-color);flex-direction:column;display:flex;position:sticky;top:0;box-shadow:0 4px 6px -4px #0000001a}._weekHeader_17rc6_21{border-bottom:1px solid var(--border-color);background-color:var(--bg-hover);display:flex}._timeHeaderSpacer_17rc6_27{border-inline-end:1px solid var(--border-color);z-index:15;background-color:var(--bg-hover);flex-shrink:0;width:60px;position:sticky}._timeHeaderSpacer_17rc6_27:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeHeaderSpacer_17rc6_27:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._timeHeaderSpacer_17rc6_27:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._timeHeaderSpacer_17rc6_27:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._dayHeader_17rc6_37{text-align:center;border-inline-end:1px solid var(--border-color);flex:1;padding:10px 0}._dayHeader_17rc6_37:last-child{border-inline-end:none}._dayName_17rc6_48{color:var(--text-secondary);text-transform:uppercase;font-size:12px}._dayNumber_17rc6_54{margin-top:4px;font-size:20px;font-weight:500}._dayNumber_17rc6_54._today_17rc6_60{color:var(--primary-color);font-weight:700}._timeGrid_17rc6_65,._eventsGrid_17rc6_71{flex:1;display:flex}._dayColumn_17rc6_76{border-inline-end:1px solid var(--border-color);flex:1;position:relative}._dayColumn_17rc6_76:last-child{border-inline-end:none}@media (max-width:768px){._dayHeader_17rc6_37,._dayColumn_17rc6_76{flex:0 0 100px;min-width:100px}._dayName_17rc6_48{font-size:10px}._dayNumber_17rc6_54{font-size:15px}}@media (max-width:480px){._dayHeader_17rc6_37,._dayColumn_17rc6_76{flex:0 0 calc(100vw - 90px);min-width:calc(100vw - 90px)}}._dateData_a2d26_1{cursor:pointer;vertical-align:top;height:calc(var(--calendar-height) / var(--calendar-rows,6));min-width:calc(var(--calendar-width) / 7);max-width:calc(var(--calendar-width) / 7);padding:.25rem;transition:background-color .15s;position:relative}._dateData_a2d26_1:hover{background-color:var(--bg-hover)}._currentMonth_a2d26_18{color:var(--text-secondary);background-color:var(--bg-hover)}._cellContent_a2d26_23{flex-direction:column;justify-content:flex-start;gap:.25rem;width:100%;height:100%;display:flex}._dateLabel_a2d26_32{width:24px;height:24px;color:var(--text-primary);border-radius:50%;justify-content:center;align-items:center;margin-block-start:2px;margin-block-end:4px;margin-inline-start:auto;margin-inline-end:2px;font-size:.8125rem;font-weight:500;transition:background-color .2s,color .2s;display:flex}._selected_a2d26_49 ._dateLabel_a2d26_32{background-color:var(--primary-color);color:#fff}._today_a2d26_54 ._dateLabel_a2d26_32{background-color:var(--primary-color);color:#fff;box-shadow:0 0 0 2px white, 0 0 0 4px var(--primary-color)}._dataContainer_a2d26_62{flex-direction:column;flex:1;gap:2px;display:flex;overflow:visible}._spacer_a2d26_70{height:1.5rem;margin-bottom:2px}._eventItem_a2d26_75{background-color:var(--primary-color);z-index:2;white-space:nowrap;text-overflow:ellipsis;color:#fff;box-sizing:border-box;cursor:pointer;border-radius:4px;height:1.5rem;padding:.15rem .5rem;font-size:.75rem;font-weight:500;line-height:1.2rem;transition:transform .1s,box-shadow .1s;position:relative;overflow:hidden;box-shadow:0 1px 2px #0000001a}._eventItem_a2d26_75:hover{filter:brightness(1.05);transform:translateY(-1px);box-shadow:0 2px 4px #00000026}._moreEventsContainer_a2d26_103{margin-top:2px;position:relative}._moreEvents_a2d26_103{color:var(--text-secondary);cursor:pointer;text-align:start;background:0 0;border:none;border-radius:4px;width:100%;padding:.15rem .5rem;font-size:.75rem;font-weight:600;transition:background-color .2s}._moreEvents_a2d26_103:hover{background-color:var(--bg-hover);color:var(--text-primary)}@media (max-width:768px){._dateLabel_a2d26_32{width:20px;height:20px;font-size:.6875rem}._eventItem_a2d26_75{height:1.25rem;padding:.1rem .25rem;font-size:.6875rem;line-height:1rem}._moreEvents_a2d26_103{padding:.1rem .25rem;font-size:.6875rem}}@media (max-width:480px){._dateLabel_a2d26_32{width:16px;height:16px;margin-block-start:1px;margin-block-end:2px;margin-inline-start:auto;margin-inline-end:1px;font-size:.625rem}._eventItem_a2d26_75{border-radius:3px;height:6px;padding:0 2px;font-size:0;line-height:0}._moreEvents_a2d26_103{display:none}._spacer_a2d26_70{height:8px}}._popover_bnbml_1{top:calc(100% + 4px);z-index:100;background-color:var(--bg-color);opacity:0;border:1px solid #0000001a;border-radius:12px;flex-direction:column;min-width:220px;max-width:320px;padding:0;animation:.2s forwards _fadeIn_bnbml_1;display:flex;position:fixed;overflow:hidden;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}._popover_bnbml_1:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._popover_bnbml_1:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}._popover_bnbml_1:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}._popover_bnbml_1:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}@keyframes _fadeIn_bnbml_1{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}._popoverHeader_bnbml_33{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;background-color:var(--bg-hover);border-bottom:1px solid var(--border-color);padding:10px 12px;font-size:.75rem;font-weight:600}._popoverContent_bnbml_44{scrollbar-width:thin;scrollbar-color:var(--border-color) transparent;max-height:250px;padding:8px;overflow-y:auto}._popoverItem_bnbml_52{background-color:var(--primary-color);color:#fff;border-radius:var(--radius-md);white-space:nowrap;text-overflow:ellipsis;cursor:pointer;flex-shrink:0;margin-bottom:2px;padding:.25rem .5rem;font-size:.75rem;transition:opacity .2s;overflow:hidden}._popoverItem_bnbml_52:hover{opacity:.9}._popoverItem_bnbml_52._startBefore_bnbml_71{clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%);padding-inline-start:14px}._popoverItem_bnbml_52._startBefore_bnbml_71:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-left-radius:0;border-bottom-left-radius:0}._popoverItem_bnbml_52._startBefore_bnbml_71:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-left-radius:0;border-bottom-left-radius:0}._popoverItem_bnbml_52._startBefore_bnbml_71:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-right-radius:0;border-bottom-right-radius:0}._popoverItem_bnbml_52._startBefore_bnbml_71:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-right-radius:0;border-bottom-right-radius:0}._popoverItem_bnbml_52._endAfter_bnbml_78{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%);padding-inline-end:14px}._popoverItem_bnbml_52._endAfter_bnbml_78:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-right-radius:0;border-bottom-right-radius:0}._popoverItem_bnbml_52._endAfter_bnbml_78:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){border-top-right-radius:0;border-bottom-right-radius:0}._popoverItem_bnbml_52._endAfter_bnbml_78:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-left-radius:0;border-bottom-left-radius:0}._popoverItem_bnbml_52._endAfter_bnbml_78:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){border-top-left-radius:0;border-bottom-left-radius:0}._popoverItem_bnbml_52._startBefore_bnbml_71._endAfter_bnbml_78{clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);border-radius:0;padding-inline-start:14px;padding-inline-end:14px}[dir=rtl] ._popoverItem_bnbml_52._startBefore_bnbml_71{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%)}[dir=rtl] ._popoverItem_bnbml_52._endAfter_bnbml_78{clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%)}._monthView_13hor_1{flex-direction:column;flex:1;height:100%;display:flex;position:relative;overflow:hidden}._table_13hor_10{border-collapse:collapse;box-sizing:border-box;flex:1;width:100%;height:100%}._tableHeader_13hor_19,._tableCell_13hor_20{border-inline-end:1px solid var(--border-color);border-bottom:1px solid var(--border-color);box-sizing:border-box}._tableHeader_13hor_19:last-child,._tableCell_13hor_20:last-child{border-inline-end:none}._table_13hor_10 tr:last-child ._tableCell_13hor_20{border-bottom:none}._tableHeader_13hor_19{background-color:var(--bg-hover);z-index:10;height:40px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;text-align:center;vertical-align:middle;font-size:.875rem;font-weight:600;position:sticky;top:0}._tableCell_13hor_20{vertical-align:top;height:calc(100% / var(--calendar-rows));width:calc((100% - var(--week-number-width,0px)) / 7);padding:4px}._weekNumberHeader_13hor_61{width:var(--week-number-width,36px);z-index:10;background-color:var(--bg-hover);position:sticky;top:0}._weekNumberCell_13hor_69{vertical-align:middle;text-align:center;color:var(--text-secondary);background-color:var(--bg-hover);border-inline-end:1px solid var(--border-color);border-bottom:1px solid var(--border-color);font-size:.875rem;font-weight:500}@media (max-width:768px){._tableHeader_13hor_19{letter-spacing:0;height:30px;font-size:.75rem}._tableCell_13hor_20{padding:2px}}._scheduleView_156gf_1{background-color:var(--bg-color);color:var(--text-primary);flex-direction:column;flex:1;height:100%;padding:0 16px 16px;display:flex;overflow-y:auto}._emptyState_156gf_12{height:100%;color:var(--text-secondary);justify-content:center;align-items:center;font-size:14px;display:flex}._dateGroup_156gf_21{border-bottom:1px solid var(--border-color);flex-direction:column;display:flex}._dateGroup_156gf_21:last-child,._dateGroup_156gf_21._noBorder_156gf_31{border-bottom:none}._eventItemContainer_156gf_35{align-items:center;gap:16px;padding:6px 0;display:flex;position:relative}._dateInfoColumn_156gf_43{flex-shrink:0;align-self:flex-start;align-items:flex-start;gap:8px;width:70px;padding-top:4px;display:flex}._dateNumber_156gf_53{color:var(--text-primary);text-align:end;padding-bottom:2px;border-radius:50%;justify-content:center;align-items:center;width:28px;min-width:28px;height:28px;padding-inline-start:1px;font-size:20px;font-weight:500;display:flex}._dateNumber_156gf_53._today_156gf_69{background-color:var(--primary-color);color:#fff}._dateSubInfo_156gf_74{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;padding-top:5px;font-size:11px}._dotTimeColumn_156gf_82{flex-shrink:0;align-items:center;gap:12px;width:140px;display:flex}._eventDot_156gf_90{background-color:var(--primary-color);border-radius:50%;flex-shrink:0;width:10px;height:10px}._eventTime_156gf_98{color:var(--text-primary);font-size:13px}._eventTitleColumn_156gf_103{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;cursor:pointer;flex:1;font-size:14px;font-weight:500;overflow:hidden}@media (max-width:480px){._scheduleView_156gf_1{padding:0 8px}._dotTimeColumn_156gf_82{gap:8px;width:100px}._dateNumber_156gf_53{width:24px;height:24px;font-size:16px}._eventTime_156gf_98{font-size:11px}._eventTitleColumn_156gf_103{font-size:13px}}._customView_1tmwe_1{background-color:var(--bg-color);flex-direction:column;height:100%;display:flex;position:relative;overflow:auto}._stickyTopContainer_1tmwe_11{z-index:10;background-color:var(--bg-color);border-bottom:1px solid var(--border-color);position:sticky;top:0}._customHeader_1tmwe_19{border-bottom:1px solid var(--border-color);display:flex}._timeHeaderSpacer_1tmwe_24{border-inline-end:1px solid var(--border-color);flex-shrink:0;width:60px}._dayHeader_1tmwe_30{text-align:center;border-inline-end:1px solid var(--border-color);flex:1;min-width:0;padding:10px 5px}._dayHeader_1tmwe_30:last-child{border-inline-end:none}._dayName_1tmwe_42{color:var(--text-secondary);text-transform:uppercase;margin-bottom:4px;font-size:12px}._dayNumber_1tmwe_49{border-radius:50%;width:32px;height:32px;margin:0 auto;font-size:18px;line-height:32px}._today_1tmwe_58{background-color:var(--primary-color);color:#fff}._timeGrid_1tmwe_63{flex:1;display:flex}._eventsGrid_1tmwe_68{flex:1;display:flex;position:relative}._dayColumn_1tmwe_74{border-inline-end:1px solid var(--border-color);flex:1;min-width:0;position:relative}._dayColumn_1tmwe_74:last-child{border-inline-end:none}@media (max-width:768px){._dayHeader_1tmwe_30{flex:0 0 100px;min-width:100px;padding:8px 4px}._dayColumn_1tmwe_74{flex:0 0 100px;min-width:100px}._dayName_1tmwe_42{font-size:10px}._dayNumber_1tmwe_49{width:26px;height:26px;font-size:15px;line-height:26px}}@media (max-width:480px){._dayHeader_1tmwe_30,._dayColumn_1tmwe_74{flex:0 0 calc(100vw - 90px);min-width:calc(100vw - 90px)}}@keyframes _shimmer_8g8rd_11{0%{background-position:-468px 0}to{background-position:468px 0}}._shimmer_8g8rd_11{background:linear-gradient(90deg,#f0f0f0 8%,#e0e0e0 18%,#f0f0f0 33%) 0 0/800px 104px;border-radius:4px;animation:1.5s linear infinite _shimmer_8g8rd_11;display:block}._monthSkeleton_8g8rd_20{flex-direction:column;flex:1;display:flex;overflow:hidden}._table_8g8rd_27{border-collapse:collapse;flex:1;width:100%;height:100%}._headerCell_8g8rd_34{background-color:var(--bg-hover);border-inline-end:1px solid var(--border-color);border-bottom:1px solid var(--border-color);vertical-align:middle;height:40px;padding:4px 8px}._headerCell_8g8rd_34:last-child{border-inline-end:none}._cell_8g8rd_47{vertical-align:top;border-inline-end:1px solid var(--border-color);border-bottom:1px solid var(--border-color);height:100px;padding:4px}._cell_8g8rd_47:last-child{border-inline-end:none}._timeGridSkeleton_8g8rd_60{border:1px solid var(--border-color);border-radius:8px;flex:1;display:flex;overflow:hidden}._timeColumn_8g8rd_68{border-inline-end:1px solid var(--border-color);flex-direction:column;flex-shrink:0;gap:16px;width:60px;padding:8px 4px;display:flex}._timeSlot_8g8rd_78{justify-content:center;display:flex}._eventsArea_8g8rd_83{flex:1;position:relative}._scheduleSkeleton_8g8rd_89{flex-direction:column;flex:1;gap:16px;padding:16px;display:flex;overflow-y:auto}._scheduleRow_8g8rd_98{border-bottom:1px solid var(--border-color);align-items:center;gap:16px;padding:8px 0;display:flex}._scheduleLines_8g8rd_106{flex-direction:column;flex:1;gap:6px;display:flex}[data-color-scheme=dark] ._shimmer_8g8rd_11{background:linear-gradient(90deg,#ffffff0a 0%,#ffffff1a 50%,#ffffff0a 100%)}[data-color-scheme=dark] ._headerCell_8g8rd_34,[data-color-scheme=dark] ._cell_8g8rd_47{border-inline-end-color:var(--border-color);border-bottom-color:var(--border-color)}@keyframes _fadeIn_cb5bq_11{0%{opacity:0}to{opacity:1}}._fadeIn_cb5bq_11{animation:.15s _fadeIn_cb5bq_11}._loadingOverlay_cb5bq_16{pointer-events:none}._viewBody_cb5bq_21{flex-direction:column;flex:1;display:flex;overflow:hidden}._views_cb5bq_28{flex:1;min-height:0}:root{--primary-color:#3b82f6;--primary-hover:#2563eb;--text-primary:#1f2937;--text-secondary:#6b7280;--bg-color:#fff;--bg-hover:#f3f4f6;--border-color:#e5e7eb;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--radius-md:.375rem;--radius-lg:.5rem;--cal-focus-color:#005fcc}[data-color-scheme=dark]{--primary-color:#60a5fa;--primary-hover:#3b82f6;--text-primary:#f9fafb;--text-secondary:#9ca3af;--bg-color:#1f2937;--bg-hover:#374151;--border-color:#374151;--cal-focus-color:#93c5fd}[role=button]:focus-visible{outline:2px solid var(--cal-focus-color,#005fcc);outline-offset:2px;border-radius:2px}button:focus-visible{outline:2px solid var(--cal-focus-color,#005fcc);outline-offset:2px;border-radius:2px}select:focus-visible{outline:2px solid var(--cal-focus-color,#005fcc);outline-offset:2px;border-radius:2px}[tabindex="0"]:focus-visible{outline:2px solid var(--cal-focus-color,#005fcc);outline-offset:2px;border-radius:2px}
 /*$vite$:1*/