@keenmate/web-daterangepicker 1.0.0-rc08 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -28
- package/dist/style.css +1 -1
- package/dist/web-daterangepicker.js +3785 -0
- package/dist/web-daterangepicker.umd.js +26 -0
- package/package.json +11 -10
- package/src/scss/_badges.scss +7 -5
- package/src/scss/_base.scss +85 -29
- package/src/scss/_calendar-grid.scss +7 -5
- package/src/scss/_header-navigation.scss +40 -17
- package/src/scss/_modifiers.scss +142 -244
- package/src/scss/_summary-actions.scss +13 -1
- package/src/scss/_tooltips.scss +3 -3
- package/src/scss/_variables.scss +13 -9
- package/dist/date-range-picker.js +0 -3222
- package/dist/date-range-picker.umd.js +0 -28
package/README.md
CHANGED
|
@@ -28,19 +28,19 @@ npm install @keenmate/web-daterangepicker
|
|
|
28
28
|
|
|
29
29
|
```html
|
|
30
30
|
<!-- Single date picker -->
|
|
31
|
-
<
|
|
31
|
+
<web-daterangepicker
|
|
32
32
|
mode="single"
|
|
33
33
|
format="YYYY-MM-DD"
|
|
34
34
|
placeholder="Select date"
|
|
35
|
-
></
|
|
35
|
+
></web-daterangepicker>
|
|
36
36
|
|
|
37
37
|
<!-- Date range picker -->
|
|
38
|
-
<
|
|
38
|
+
<web-daterangepicker
|
|
39
39
|
mode="range"
|
|
40
40
|
format="YYYY-MM-DD"
|
|
41
41
|
months-to-show="2"
|
|
42
42
|
placeholder="Select date range"
|
|
43
|
-
></
|
|
43
|
+
></web-daterangepicker>
|
|
44
44
|
```
|
|
45
45
|
|
|
46
46
|
### With JavaScript/TypeScript
|
|
@@ -52,7 +52,7 @@ import '@keenmate/web-daterangepicker';
|
|
|
52
52
|
// Or import styles separately if needed
|
|
53
53
|
import '@keenmate/web-daterangepicker/style.css';
|
|
54
54
|
|
|
55
|
-
const picker = document.querySelector('
|
|
55
|
+
const picker = document.querySelector('web-daterangepicker');
|
|
56
56
|
|
|
57
57
|
// Listen for date selection
|
|
58
58
|
picker.addEventListener('date-select', (e) => {
|
|
@@ -139,13 +139,13 @@ Control which day the week starts on (auto-detected by default from user's local
|
|
|
139
139
|
|
|
140
140
|
```html
|
|
141
141
|
<!-- Auto-detect from locale (default) -->
|
|
142
|
-
<
|
|
142
|
+
<web-daterangepicker week-start-day="auto"></web-daterangepicker>
|
|
143
143
|
|
|
144
144
|
<!-- Force Sunday start -->
|
|
145
|
-
<
|
|
145
|
+
<web-daterangepicker week-start-day="0"></web-daterangepicker>
|
|
146
146
|
|
|
147
147
|
<!-- Force Monday start (common in Europe) -->
|
|
148
|
-
<
|
|
148
|
+
<web-daterangepicker week-start-day="1"></web-daterangepicker>
|
|
149
149
|
```
|
|
150
150
|
|
|
151
151
|
### Disabled Dates & Date Restrictions
|
|
@@ -154,19 +154,19 @@ Control which day the week starts on (auto-detected by default from user's local
|
|
|
154
154
|
|
|
155
155
|
```html
|
|
156
156
|
<!-- Disable weekends -->
|
|
157
|
-
<
|
|
157
|
+
<web-daterangepicker disabled-days="0,6"></web-daterangepicker>
|
|
158
158
|
|
|
159
159
|
<!-- Date range restriction -->
|
|
160
|
-
<
|
|
160
|
+
<web-daterangepicker
|
|
161
161
|
min-date="2025-01-01"
|
|
162
162
|
max-date="2025-12-31">
|
|
163
|
-
</
|
|
163
|
+
</web-daterangepicker>
|
|
164
164
|
```
|
|
165
165
|
|
|
166
166
|
#### Complex Restrictions (JavaScript)
|
|
167
167
|
|
|
168
168
|
```javascript
|
|
169
|
-
const picker = document.querySelector('
|
|
169
|
+
const picker = document.querySelector('web-daterangepicker');
|
|
170
170
|
|
|
171
171
|
// Disable specific dates (e.g., public holidays)
|
|
172
172
|
picker.disabledDates = [
|
|
@@ -189,7 +189,7 @@ picker.isDateDisabled = (date) => {
|
|
|
189
189
|
Add visual indicators and labels to specific dates:
|
|
190
190
|
|
|
191
191
|
```javascript
|
|
192
|
-
const picker = document.querySelector('
|
|
192
|
+
const picker = document.querySelector('web-daterangepicker');
|
|
193
193
|
|
|
194
194
|
picker.specialDates = [
|
|
195
195
|
{
|
|
@@ -247,17 +247,17 @@ picker.getDateInfo = (date) => {
|
|
|
247
247
|
|
|
248
248
|
```css
|
|
249
249
|
/* Holiday styling (predefined class) */
|
|
250
|
-
|
|
250
|
+
web-daterangepicker::part(calendar) .pa-date-picker__day.holiday {
|
|
251
251
|
background-color: rgba(239, 68, 68, 0.1);
|
|
252
252
|
}
|
|
253
253
|
|
|
254
254
|
/* Event styling (predefined class) */
|
|
255
|
-
|
|
255
|
+
web-daterangepicker::part(calendar) .pa-date-picker__day.event {
|
|
256
256
|
background-color: rgba(16, 185, 129, 0.1);
|
|
257
257
|
}
|
|
258
258
|
|
|
259
259
|
/* Custom class example */
|
|
260
|
-
|
|
260
|
+
web-daterangepicker::part(calendar) .pa-date-picker__day.peak-season {
|
|
261
261
|
background-color: rgba(251, 191, 36, 0.15);
|
|
262
262
|
font-weight: 600;
|
|
263
263
|
}
|
|
@@ -272,11 +272,11 @@ When selecting date ranges that include disabled dates (e.g., selecting a workin
|
|
|
272
272
|
Allows range selections over disabled dates. Returns both enabled and disabled date arrays:
|
|
273
273
|
|
|
274
274
|
```html
|
|
275
|
-
<
|
|
275
|
+
<web-daterangepicker
|
|
276
276
|
mode="range"
|
|
277
277
|
disabled-days="0,6"
|
|
278
278
|
range-disabled-mode="allow">
|
|
279
|
-
</
|
|
279
|
+
</web-daterangepicker>
|
|
280
280
|
|
|
281
281
|
<script>
|
|
282
282
|
picker.addEventListener('date-select', (e) => {
|
|
@@ -295,10 +295,10 @@ picker.addEventListener('date-select', (e) => {
|
|
|
295
295
|
Prevents range selections from crossing disabled dates. Automatically snaps to the last enabled date before the gap:
|
|
296
296
|
|
|
297
297
|
```html
|
|
298
|
-
<
|
|
298
|
+
<web-daterangepicker
|
|
299
299
|
mode="range"
|
|
300
300
|
range-disabled-mode="block">
|
|
301
|
-
</
|
|
301
|
+
</web-daterangepicker>
|
|
302
302
|
```
|
|
303
303
|
|
|
304
304
|
When dragging from day 1 to day 7 with days 4-5 disabled, the selection will automatically snap to days 1-3.
|
|
@@ -310,11 +310,11 @@ When dragging from day 1 to day 7 with days 4-5 disabled, the selection will aut
|
|
|
310
310
|
Returns multiple date ranges separated by disabled dates:
|
|
311
311
|
|
|
312
312
|
```html
|
|
313
|
-
<
|
|
313
|
+
<web-daterangepicker
|
|
314
314
|
mode="range"
|
|
315
315
|
disabled-days="0,6"
|
|
316
316
|
range-disabled-mode="split">
|
|
317
|
-
</
|
|
317
|
+
</web-daterangepicker>
|
|
318
318
|
|
|
319
319
|
<script>
|
|
320
320
|
picker.addEventListener('date-select', (e) => {
|
|
@@ -333,11 +333,11 @@ picker.addEventListener('date-select', (e) => {
|
|
|
333
333
|
Returns a flat array of individual enabled dates:
|
|
334
334
|
|
|
335
335
|
```html
|
|
336
|
-
<
|
|
336
|
+
<web-daterangepicker
|
|
337
337
|
mode="range"
|
|
338
338
|
disabled-days="0,6"
|
|
339
339
|
range-disabled-mode="individual">
|
|
340
|
-
</
|
|
340
|
+
</web-daterangepicker>
|
|
341
341
|
|
|
342
342
|
<script>
|
|
343
343
|
picker.addEventListener('date-select', (e) => {
|
|
@@ -366,19 +366,19 @@ By default, when you select a range that includes disabled dates, all dates (bot
|
|
|
366
366
|
|
|
367
367
|
```html
|
|
368
368
|
<!-- Default: highlights all dates in range, including disabled weekends -->
|
|
369
|
-
<
|
|
369
|
+
<web-daterangepicker
|
|
370
370
|
mode="range"
|
|
371
371
|
disabled-days="0,6"
|
|
372
372
|
range-disabled-mode="split">
|
|
373
|
-
</
|
|
373
|
+
</web-daterangepicker>
|
|
374
374
|
|
|
375
375
|
<!-- Only highlight enabled dates (Mon-Fri), skip weekends -->
|
|
376
|
-
<
|
|
376
|
+
<web-daterangepicker
|
|
377
377
|
mode="range"
|
|
378
378
|
disabled-days="0,6"
|
|
379
379
|
range-disabled-mode="split"
|
|
380
380
|
highlight-disabled-in-range="false">
|
|
381
|
-
</
|
|
381
|
+
</web-daterangepicker>
|
|
382
382
|
```
|
|
383
383
|
|
|
384
384
|
**When to use `highlight-disabled-in-range="false"`:**
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:host{--drp-card-bg: #ffffff;--drp-border-color: #e5e7eb;--drp-primary-bg: #f3f4f6;--drp-primary-bg-hover: #e5e7eb;--drp-accent-color: #3b82f6;--drp-accent-color-hover: #2563eb;--drp-text-primary: #111827;--drp-text-secondary: #6b7280;--drp-accent-text-color: #ffffff;--drp-button-text-color: #ffffff;--drp-spacing-xs: .25rem;--drp-spacing-sm: .5rem;--drp-spacing-md: 1rem;--drp-spacing-lg: 1.5rem;--drp-spacing-xl: 2rem;--drp-font-size-2xs: .625rem;--drp-font-size-xs: .75rem;--drp-font-size-sm: .875rem;--drp-font-size-base: 1rem;--drp-font-size-lg: 1.125rem;--drp-font-size-xl: 1.25rem;--drp-font-size-2xl: 1.5rem;--drp-font-weight-medium: 500;--drp-font-weight-semibold: 600;--drp-border-width-base: 1px;--drp-border-radius: .375rem;--drp-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--drp-transition-fast: .15s;--drp-easing-snappy: cubic-bezier(.4, 0, .2, 1);--drp-input-padding-h: .75rem;--drp-grid-columns: 3;--drp-grid-rows: 2}.drp-date-picker-input{position:relative;cursor:pointer}.drp-date-picker-input:after{content:"📅";position:absolute;right:var(--drp-input-padding-h);top:50%;transform:translateY(-50%);pointer-events:none;opacity:.6}.drp-date-picker{position:absolute;z-index:9500;background:var(--drp-card-bg);border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);box-shadow:var(--drp-shadow-xl);padding:var(--drp-spacing-md);min-width:280px;max-width:calc(100vw - 2rem);box-sizing:border-box;-webkit-user-select:none;user-select:none}.drp-date-picker:not(.drp-date-picker--visible){display:none}.drp-date-picker--inline{position:relative!important;display:block!important;z-index:auto;min-width:0;max-width:100%;width:fit-content;box-sizing:border-box}.drp-date-picker__months{display:flex;gap:var(--drp-spacing-lg)}.drp-date-picker--inline .drp-date-picker__months{flex-wrap:wrap}.drp-date-picker__months--grid{display:grid;grid-template-columns:repeat(var(--drp-grid-columns, 3),minmax(0,1fr));grid-template-rows:repeat(var(--drp-grid-rows, 2),auto);gap:var(--drp-spacing-lg);width:100%}@media (max-width: 1200px){.drp-date-picker__months--grid{grid-template-columns:repeat(min(var(--drp-grid-columns, 3),3),minmax(0,1fr))}}@media (max-width: 768px){.drp-date-picker__months--grid{grid-template-columns:repeat(min(var(--drp-grid-columns, 3),2),minmax(0,1fr))}}@media (max-width: 480px){.drp-date-picker__months--grid{grid-template-columns:minmax(0,1fr)}}.drp-date-picker__month{flex:1;min-width:280px}.drp-date-picker--inline .drp-date-picker__month{min-width:250px}.drp-date-picker__months--grid .drp-date-picker__month{min-width:0;width:100%}.drp-date-picker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--drp-spacing-md);gap:var(--drp-spacing-sm)}.drp-date-picker__month-year{flex:1;text-align:center;font-weight:var(--drp-font-weight-semibold);font-size:var(--drp-font-size-base);color:var(--drp-text-primary);padding:var(--drp-spacing-sm) var(--drp-spacing-md);border-radius:var(--drp-border-radius);cursor:pointer;transition:background-color var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker__month-year:hover{background-color:var(--drp-primary-bg)}.drp-date-picker__month-year:active{background-color:var(--drp-primary-bg-hover)}.drp-date-picker__nav{width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);background:transparent;cursor:pointer;transition:all var(--drp-transition-fast) var(--drp-easing-snappy);font-size:var(--drp-font-size-lg);color:var(--drp-text-primary)}.drp-date-picker__nav:hover{background-color:var(--drp-primary-bg);border-color:var(--drp-accent-color)}.drp-date-picker__nav:active{background-color:var(--drp-primary-bg-hover)}.drp-date-picker__nav--disabled,.drp-date-picker__nav[disabled]{opacity:.6;cursor:not-allowed;pointer-events:none}.drp-date-picker__nav--disabled:hover,.drp-date-picker__nav[disabled]:hover{background-color:transparent;border-color:var(--drp-border-color)}.drp-date-picker__nav--prev:before{content:"‹"}.drp-date-picker__nav--next:before{content:"›"}.drp-date-picker__rolling-selector{display:none}.drp-date-picker__rolling-selector.drp-date-picker__rolling-selector--visible{display:flex}.drp-date-picker__rolling-selector.drp-date-picker__rolling-selector--visible~.drp-date-picker__weekdays,.drp-date-picker__rolling-selector.drp-date-picker__rolling-selector--visible~.drp-date-picker__days{display:none}.drp-date-picker__rolling-selector{gap:var(--drp-spacing-xs);margin-bottom:var(--drp-spacing-md)}.drp-date-picker__rolling-list{flex:1;height:100%;overflow-y:auto;border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);scroll-behavior:smooth}.drp-date-picker__rolling-list::-webkit-scrollbar{width:6px}.drp-date-picker__rolling-list::-webkit-scrollbar-track{background:var(--drp-primary-bg)}.drp-date-picker__rolling-list::-webkit-scrollbar-thumb{background:var(--drp-border-color);border-radius:3px}.drp-date-picker__rolling-list::-webkit-scrollbar-thumb:hover{background:var(--drp-accent-color)}.drp-date-picker__rolling-item{padding:var(--drp-spacing-sm) var(--drp-spacing-md);text-align:center;cursor:pointer;font-size:var(--drp-font-size-sm);transition:background-color var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker__rolling-item:hover{background-color:var(--drp-primary-bg)}.drp-date-picker__rolling-item--selected{background-color:var(--drp-accent-color);color:var(--drp-accent-text-color);font-weight:var(--drp-font-weight-semibold)}.drp-date-picker__rolling-item--selected:hover{background-color:var(--drp-accent-color-hover)}.drp-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--drp-spacing-xs);margin-bottom:var(--drp-spacing-sm)}.drp-date-picker__weekday{text-align:center;font-size:var(--drp-font-size-xs);font-weight:var(--drp-font-weight-semibold);color:var(--drp-text-secondary);padding:var(--drp-spacing-xs);text-transform:uppercase}.drp-date-picker__days{display:flex;flex-direction:column;gap:var(--drp-spacing-xs);margin-bottom:var(--drp-spacing-md)}.drp-date-picker__date-row{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--drp-spacing-xs)}.drp-date-picker__day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:var(--drp-font-size-sm);color:var(--drp-text-primary);border-radius:var(--drp-border-radius);cursor:pointer;transition:all var(--drp-transition-fast) var(--drp-easing-snappy);border:2px solid transparent;position:relative}.drp-date-picker__day:hover:not(.drp-date-picker__day--disabled):not(.drp-date-picker__day--other-month){background-color:var(--drp-primary-bg);border-color:var(--drp-accent-color)}.drp-date-picker__day--today{border-color:var(--drp-accent-color);font-weight:var(--drp-font-weight-semibold)}.drp-date-picker__day--selected{background-color:var(--drp-accent-color);color:var(--drp-accent-text-color);font-weight:var(--drp-font-weight-semibold)}.drp-date-picker__day--selected:hover{background-color:var(--drp-accent-color-hover)}.drp-date-picker__day--focused{outline:2px solid var(--drp-accent-color);outline-offset:2px}.drp-date-picker__day--disabled{color:var(--drp-text-secondary);opacity:.6;cursor:not-allowed;position:relative}.drp-date-picker__day--disabled:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient(45deg,rgba(0,0,0,.1) 0px,rgba(0,0,0,.1) 1px,transparent 1px,transparent 6px);border-radius:var(--drp-border-radius);pointer-events:none}.drp-date-picker__day--disabled:hover{background-color:transparent;border-color:transparent}.drp-date-picker__day--other-month{color:var(--drp-text-secondary);opacity:.5}.drp-date-picker__day--other-month.drp-date-picker__day--range-start,.drp-date-picker__day--other-month.drp-date-picker__day--range-end,.drp-date-picker__day--other-month.drp-date-picker__day--in-range,.drp-date-picker__day--other-month.drp-date-picker__day--drag-preview{opacity:1}.drp-date-picker__day--range-start,.drp-date-picker__day--range-end{background-color:var(--drp-accent-color);color:var(--drp-accent-text-color);font-weight:var(--drp-font-weight-semibold);cursor:grab;-webkit-user-select:none;user-select:none}.drp-date-picker__day--range-start:active,.drp-date-picker__day--range-end:active{cursor:grabbing}.drp-date-picker__day--in-range{background-color:color-mix(in srgb,var(--drp-accent-color) 15%,transparent)}.drp-date-picker__day--in-range:hover{background-color:color-mix(in srgb,var(--drp-accent-color) 25%,transparent)}.drp-date-picker__day--dragging{cursor:grabbing!important;opacity:.7;transform:scale(1.1);transition:transform var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker__day--drag-preview{background-color:color-mix(in srgb,var(--drp-accent-color) 30%,transparent);border:2px dashed var(--drp-accent-color)}.drp-date-picker__day--drag-preview.drp-date-picker__day--range-start,.drp-date-picker__day--drag-preview.drp-date-picker__day--range-end{background-color:color-mix(in srgb,var(--drp-accent-color) 60%,transparent);color:var(--drp-accent-text-color)}.drp-date-picker__day--drag-invalid{background-color:color-mix(in srgb,#ef4444 20%,transparent)!important;border-color:#ef4444!important;border-style:dashed!important}.drp-date-picker__day.holiday{background-color:color-mix(in srgb,#ef4444 10%,transparent)}.drp-date-picker__day.holiday:hover:not(.drp-date-picker__day--disabled){background-color:color-mix(in srgb,#ef4444 20%,transparent)}.drp-date-picker__day.event{background-color:color-mix(in srgb,#10b981 10%,transparent)}.drp-date-picker__day.event:hover:not(.drp-date-picker__day--disabled){background-color:color-mix(in srgb,#10b981 20%,transparent)}.drp-date-picker__rolling-item--disabled{color:var(--drp-text-secondary);opacity:.4;cursor:not-allowed;pointer-events:none;text-decoration:line-through}.drp-date-picker__rolling-item--disabled:hover{background-color:transparent}.drp-date-picker__badge-row{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--drp-spacing-xs);margin-bottom:var(--drp-spacing-xs);max-height:1rem;min-height:1rem}.drp-date-picker__badge-cell{display:flex;align-items:center;justify-content:center;font-size:var(--drp-font-size-2xs);padding:1px 2px;border-radius:2px;transition:all var(--drp-transition-fast) var(--drp-easing-snappy);cursor:pointer;height:100%;max-height:1rem}.drp-date-picker__badge-cell:empty{visibility:hidden}.drp-date-picker__badge-cell:hover:not(:empty){transform:scale(1.05)}.drp-date-picker__badge-cell.badge-number{background-color:#10b981;color:#fff;font-size:.7rem;font-weight:600}.drp-date-picker__badge-cell.badge-count{background-color:#ef4444;color:#fff;font-size:.7rem;font-weight:700}.drp-date-picker__badge-cell.badge-text{background-color:#6b7280;color:#fff;font-size:.65rem;font-weight:700;text-transform:uppercase}.drp-date-picker__summary{text-align:center;padding:var(--drp-spacing-md);border-top:var(--drp-border-width-base) solid var(--drp-border-color);font-size:var(--drp-font-size-sm);color:var(--drp-text-secondary)}.drp-date-picker__summary--visible{display:block}.drp-date-picker__summary--hidden{display:none}.drp-date-picker__summary-count{font-weight:var(--drp-font-weight-semibold);color:var(--drp-accent-color);font-size:var(--drp-font-size-base)}.drp-date-picker__actions{display:flex;gap:var(--drp-spacing-sm);justify-content:space-between;padding-top:var(--drp-spacing-sm);border-top:var(--drp-border-width-base) solid var(--drp-border-color)}.drp-date-picker__button{flex:1;padding:var(--drp-spacing-sm) var(--drp-spacing-md);border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);background:transparent;cursor:pointer;font-size:var(--drp-font-size-sm);font-weight:var(--drp-font-weight-medium);transition:all var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker__button:hover{background-color:var(--drp-primary-bg);border-color:var(--drp-accent-color)}.drp-date-picker__button--today{color:var(--drp-accent-color)}.drp-date-picker__button--clear{color:var(--drp-text-secondary)}.drp-date-picker__button--apply{background-color:var(--drp-accent-color);color:var(--drp-button-text-color);border-color:var(--drp-accent-color)}.drp-date-picker__button--apply:hover{background-color:var(--drp-accent-color-hover)}.drp-date-picker__button--cancel{color:var(--drp-text-secondary)}.drp-date-picker__tooltip{position:absolute;z-index:9999;background-color:var(--drp-text-primary);color:#fff;padding:var(--drp-spacing-xs) var(--drp-spacing-sm);border-radius:var(--drp-border-radius);font-size:var(--drp-font-size-xs);line-height:1.4;max-width:200px;word-wrap:break-word;pointer-events:none;opacity:0;transition:opacity var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker__tooltip--visible{opacity:1}.drp-date-picker__tooltip-arrow{position:absolute;background-color:var(--drp-text-primary);width:8px;height:8px;transform:rotate(45deg)}.drp-date-picker__loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#fffc;display:flex;align-items:center;justify-content:center;z-index:9500;border-radius:.375rem}.drp-date-picker__loading-spinner{width:40px;height:40px;border:4px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:drp-spin .8s linear infinite}@keyframes drp-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.drp-font-xs{--drp-font-size-2xs: .4375rem;--drp-font-size-xs: .525rem;--drp-font-size-sm: .6125rem;--drp-font-size-base: .7rem;--drp-font-size-lg: .7875rem;--drp-font-size-xl: .875rem;--drp-font-size-2xl: 1.05rem}.drp-font-sm{--drp-font-size-2xs: .53125rem;--drp-font-size-xs: .6375rem;--drp-font-size-sm: .74375rem;--drp-font-size-base: .85rem;--drp-font-size-lg: .95625rem;--drp-font-size-xl: 1.0625rem;--drp-font-size-2xl: 1.275rem}.drp-font-lg{--drp-font-size-2xs: .75rem;--drp-font-size-xs: .9rem;--drp-font-size-sm: 1.05rem;--drp-font-size-base: 1.2rem;--drp-font-size-lg: 1.35rem;--drp-font-size-xl: 1.5rem;--drp-font-size-2xl: 1.8rem}.drp-font-xl{--drp-font-size-2xs: .875rem;--drp-font-size-xs: 1.05rem;--drp-font-size-sm: 1.225rem;--drp-font-size-base: 1.4rem;--drp-font-size-lg: 1.575rem;--drp-font-size-xl: 1.75rem;--drp-font-size-2xl: 2.1rem}.drp-spacing-xs{--drp-spacing-xs: .175rem;--drp-spacing-sm: .35rem;--drp-spacing-md: .7rem;--drp-spacing-lg: 1.05rem;--drp-spacing-xl: 1.4rem}.drp-spacing-xs .drp-date-picker__month{min-width:196px}.drp-spacing-sm{--drp-spacing-xs: .2125rem;--drp-spacing-sm: .425rem;--drp-spacing-md: .85rem;--drp-spacing-lg: 1.275rem;--drp-spacing-xl: 1.7rem}.drp-spacing-sm .drp-date-picker__month{min-width:238px}.drp-spacing-lg{--drp-spacing-xs: .3rem;--drp-spacing-sm: .6rem;--drp-spacing-md: 1.2rem;--drp-spacing-lg: 1.8rem;--drp-spacing-xl: 2.4rem}.drp-spacing-lg .drp-date-picker__month{min-width:336px}.drp-spacing-xl{--drp-spacing-xs: .35rem;--drp-spacing-sm: .7rem;--drp-spacing-md: 1.4rem;--drp-spacing-lg: 2.1rem;--drp-spacing-xl: 2.8rem}.drp-spacing-xl .drp-date-picker__month{min-width:392px}@media (max-width: 1200px){.drp-responsive.drp-font-xl{--drp-font-size-2xs: .75rem;--drp-font-size-xs: .9rem;--drp-font-size-sm: 1.05rem;--drp-font-size-base: 1.2rem;--drp-font-size-lg: 1.35rem;--drp-font-size-xl: 1.5rem;--drp-font-size-2xl: 1.8rem}}@media (max-width: 768px){.drp-responsive.drp-font-xl{--drp-font-size-2xs: .625rem;--drp-font-size-xs: .75rem;--drp-font-size-sm: .875rem;--drp-font-size-base: 1rem;--drp-font-size-lg: 1.125rem;--drp-font-size-xl: 1.25rem;--drp-font-size-2xl: 1.5rem}}@media (max-width: 1200px){.drp-responsive.drp-font-lg{--drp-font-size-2xs: .625rem;--drp-font-size-xs: .75rem;--drp-font-size-sm: .875rem;--drp-font-size-base: 1rem;--drp-font-size-lg: 1.125rem;--drp-font-size-xl: 1.25rem;--drp-font-size-2xl: 1.5rem}}@media (max-width: 768px){.drp-responsive.drp-font-lg{--drp-font-size-2xs: .53125rem;--drp-font-size-xs: .6375rem;--drp-font-size-sm: .74375rem;--drp-font-size-base: .85rem;--drp-font-size-lg: .95625rem;--drp-font-size-xl: 1.0625rem;--drp-font-size-2xl: 1.275rem}}@media (max-width: 768px){.drp-responsive.drp-font-md{--drp-font-size-2xs: .53125rem;--drp-font-size-xs: .6375rem;--drp-font-size-sm: .74375rem;--drp-font-size-base: .85rem;--drp-font-size-lg: .95625rem;--drp-font-size-xl: 1.0625rem;--drp-font-size-2xl: 1.275rem}}@media (max-width: 768px){.drp-responsive.drp-font-sm{--drp-font-size-2xs: .4375rem;--drp-font-size-xs: .525rem;--drp-font-size-sm: .6125rem;--drp-font-size-base: .7rem;--drp-font-size-lg: .7875rem;--drp-font-size-xl: .875rem;--drp-font-size-2xl: 1.05rem}}@media (max-width: 1200px){.drp-responsive.drp-spacing-xl{--drp-spacing-xs: .3rem;--drp-spacing-sm: .6rem;--drp-spacing-md: 1.2rem;--drp-spacing-lg: 1.8rem;--drp-spacing-xl: 2.4rem}.drp-responsive.drp-spacing-xl .drp-date-picker__month{min-width:336px}}@media (max-width: 768px){.drp-responsive.drp-spacing-xl{--drp-spacing-xs: .25rem;--drp-spacing-sm: .5rem;--drp-spacing-md: 1rem;--drp-spacing-lg: 1.5rem;--drp-spacing-xl: 2rem}.drp-responsive.drp-spacing-xl .drp-date-picker__month{min-width:280px}}@media (max-width: 1200px){.drp-responsive.drp-spacing-lg{--drp-spacing-xs: .25rem;--drp-spacing-sm: .5rem;--drp-spacing-md: 1rem;--drp-spacing-lg: 1.5rem;--drp-spacing-xl: 2rem}.drp-responsive.drp-spacing-lg .drp-date-picker__month{min-width:280px}}@media (max-width: 768px){.drp-responsive.drp-spacing-lg{--drp-spacing-xs: .2125rem;--drp-spacing-sm: .425rem;--drp-spacing-md: .85rem;--drp-spacing-lg: 1.275rem;--drp-spacing-xl: 1.7rem}.drp-responsive.drp-spacing-lg .drp-date-picker__month{min-width:238px}}@media (max-width: 768px){.drp-responsive.drp-spacing-md{--drp-spacing-xs: .2125rem;--drp-spacing-sm: .425rem;--drp-spacing-md: .85rem;--drp-spacing-lg: 1.275rem;--drp-spacing-xl: 1.7rem}.drp-responsive.drp-spacing-md .drp-date-picker__month{min-width:238px}}@media (max-width: 768px){.drp-responsive.drp-spacing-sm{--drp-spacing-xs: .175rem;--drp-spacing-sm: .35rem;--drp-spacing-md: .7rem;--drp-spacing-lg: 1.05rem;--drp-spacing-xl: 1.4rem}.drp-responsive.drp-spacing-sm .drp-date-picker__month{min-width:196px}}.drp-date-picker--xs{padding:var(--drp-spacing-sm);min-width:240px}.drp-date-picker--xs .drp-date-picker__month-year{font-size:var(--drp-font-size-xs);padding:var(--drp-spacing-xs) var(--drp-spacing-sm)}.drp-date-picker--xs .drp-date-picker__nav{width:1.5rem;height:1.5rem;font-size:var(--drp-font-size-sm)}.drp-date-picker--xs .drp-date-picker__weekday{font-size:var(--drp-font-size-2xs)}.drp-date-picker--xs .drp-date-picker__day{font-size:var(--drp-font-size-xs)}.drp-date-picker--sm{padding:var(--drp-spacing-sm);min-width:260px}.drp-date-picker--sm .drp-date-picker__month-year{font-size:var(--drp-font-size-sm);padding:var(--drp-spacing-xs) var(--drp-spacing-sm)}.drp-date-picker--sm .drp-date-picker__nav{width:1.75rem;height:1.75rem;font-size:var(--drp-font-size-base)}.drp-date-picker--sm .drp-date-picker__day{font-size:var(--drp-font-size-xs)}.drp-date-picker--lg{padding:var(--drp-spacing-lg);min-width:320px}.drp-date-picker--lg .drp-date-picker__month-year{font-size:var(--drp-font-size-lg);padding:var(--drp-spacing-md) var(--drp-spacing-lg)}.drp-date-picker--lg .drp-date-picker__nav{width:2.5rem;height:2.5rem;font-size:var(--drp-font-size-xl)}.drp-date-picker--lg .drp-date-picker__day{font-size:var(--drp-font-size-base)}.drp-date-picker--xl{padding:var(--drp-spacing-xl);min-width:360px}.drp-date-picker--xl .drp-date-picker__month-year{font-size:var(--drp-font-size-xl);padding:var(--drp-spacing-lg) var(--drp-spacing-xl)}.drp-date-picker--xl .drp-date-picker__nav{width:3rem;height:3rem;font-size:var(--drp-font-size-2xl)}.drp-date-picker--xl .drp-date-picker__day{font-size:var(--drp-font-size-lg)}.drp-date-picker--inline{position:static;display:block;box-shadow:none}
|
|
1
|
+
@charset "UTF-8";:host{--drp-font-scale: 1;--drp-spacing-scale: 1;--drp-cell-scale: 1;--drp-spacing-xs-base: .25rem;--drp-spacing-sm-base: .5rem;--drp-spacing-md-base: 1rem;--drp-spacing-lg-base: 1.5rem;--drp-spacing-xl-base: 2rem;--drp-spacing-xs: calc(var(--drp-spacing-xs-base) * var(--drp-spacing-scale));--drp-spacing-sm: calc(var(--drp-spacing-sm-base) * var(--drp-spacing-scale));--drp-spacing-md: calc(var(--drp-spacing-md-base) * var(--drp-spacing-scale));--drp-spacing-lg: calc(var(--drp-spacing-lg-base) * var(--drp-spacing-scale));--drp-spacing-xl: calc(var(--drp-spacing-xl-base) * var(--drp-spacing-scale));--drp-font-size-2xs-base: .625rem;--drp-font-size-xs-base: .75rem;--drp-font-size-sm-base: .875rem;--drp-font-size-base-base: 1rem;--drp-font-size-lg-base: 1.125rem;--drp-font-size-xl-base: 1.25rem;--drp-font-size-2xl-base: 1.5rem;--drp-font-weight-medium: 500;--drp-font-weight-semibold: 600;--drp-card-bg: #ffffff;--drp-border-color: #e5e7eb;--drp-primary-bg: #f3f4f6;--drp-primary-bg-hover: #e5e7eb;--drp-accent-color: #3b82f6;--drp-accent-color-hover: #2563eb;--drp-text-primary: #111827;--drp-text-secondary: #6b7280;--drp-accent-text-color: #ffffff;--drp-button-text-color: #ffffff;--drp-tooltip-bg: #111827;--drp-tooltip-color: #ffffff;--drp-border-width-base: 1px;--drp-border-radius: .375rem;--drp-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--drp-transition-fast: .15s;--drp-easing-snappy: cubic-bezier(.4, 0, .2, 1);--drp-input-padding-h: .75rem;--drp-grid-columns: 3;--drp-grid-rows: 2}.drp-date-picker-input{position:relative;cursor:pointer}.drp-date-picker-input:after{content:"📅";position:absolute;right:var(--drp-input-padding-h);top:50%;transform:translateY(-50%);pointer-events:none;opacity:.6}.drp-date-picker{position:absolute;z-index:9500;background:var(--drp-card-bg);border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);box-shadow:var(--drp-shadow-xl);padding:var(--drp-spacing-md);min-width:280px;max-width:calc(100vw - 2rem);box-sizing:border-box;-webkit-user-select:none;user-select:none;--drp-font-size-2xs: calc(var(--drp-font-size-2xs-base) * var(--drp-font-scale));--drp-font-size-xs: calc(var(--drp-font-size-xs-base) * var(--drp-font-scale));--drp-font-size-sm: calc(var(--drp-font-size-sm-base) * var(--drp-font-scale));--drp-font-size-base: calc(var(--drp-font-size-base-base) * var(--drp-font-scale));--drp-font-size-lg: calc(var(--drp-font-size-lg-base) * var(--drp-font-scale));--drp-font-size-xl: calc(var(--drp-font-size-xl-base) * var(--drp-font-scale));--drp-font-size-2xl: calc(var(--drp-font-size-2xl-base) * var(--drp-font-scale))}.drp-date-picker:not(.drp-date-picker--visible){display:none}.drp-date-picker--inline{position:relative!important;display:block!important;z-index:auto;min-width:0;max-width:100%;width:fit-content;box-sizing:border-box}.drp-date-picker__months{display:flex;gap:var(--drp-spacing-lg)}.drp-date-picker--inline .drp-date-picker__months{flex-wrap:wrap}.drp-date-picker__months--grid{display:grid;grid-template-columns:repeat(var(--drp-grid-columns, 3),minmax(0,1fr));grid-template-rows:repeat(var(--drp-grid-rows, 2),auto);gap:var(--drp-spacing-lg);width:100%}@media (max-width: 1200px){.drp-date-picker__months--grid{grid-template-columns:repeat(min(var(--drp-grid-columns, 3),3),minmax(0,1fr))}}@media (max-width: 768px){.drp-date-picker__months--grid{grid-template-columns:repeat(min(var(--drp-grid-columns, 3),2),minmax(0,1fr))}}@media (max-width: 480px){.drp-date-picker__months--grid{grid-template-columns:minmax(0,1fr)}}.drp-date-picker__month{flex:1;min-width:calc(280px * var(--drp-cell-scale));display:flex;flex-direction:column}.drp-date-picker--inline .drp-date-picker__month{min-width:calc(250px * var(--drp-cell-scale))}.drp-date-picker__months--grid .drp-date-picker__month{min-width:0;width:100%}.drp-date-picker__calendar-container{position:relative;flex:1;display:flex;flex-direction:column;min-height:0}.drp-date-picker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--drp-spacing-md);gap:var(--drp-spacing-sm)}.drp-date-picker__month-year{flex:1;text-align:center;font-weight:var(--drp-font-weight-semibold);font-size:var(--drp-font-size-base);color:var(--drp-text-primary);padding:var(--drp-spacing-sm) var(--drp-spacing-md);border-radius:var(--drp-border-radius);cursor:pointer}.drp-date-picker__month-year:hover{background-color:var(--drp-primary-bg)}.drp-date-picker__month-year:active{background-color:var(--drp-primary-bg-hover)}.drp-date-picker__nav{width:calc(2rem * var(--drp-cell-scale));height:calc(2rem * var(--drp-cell-scale));display:flex;align-items:center;justify-content:center;border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);background:transparent;cursor:pointer;font-size:var(--drp-font-size-lg);color:var(--drp-text-primary)}.drp-date-picker__nav:hover{background-color:var(--drp-primary-bg);border-color:var(--drp-accent-color)}.drp-date-picker__nav:active{background-color:var(--drp-primary-bg-hover)}.drp-date-picker__nav--disabled,.drp-date-picker__nav[disabled]{opacity:.6;cursor:not-allowed;pointer-events:none}.drp-date-picker__nav--disabled:hover,.drp-date-picker__nav[disabled]:hover{background-color:transparent;border-color:var(--drp-border-color)}.drp-date-picker__nav--prev:before{content:"‹"}.drp-date-picker__nav--next:before{content:"›"}.drp-date-picker__rolling-selector{position:absolute;top:0;right:0;bottom:0;left:0;display:none;z-index:10}.drp-date-picker__rolling-selector.drp-date-picker__rolling-selector--visible{display:flex}.drp-date-picker__rolling-selector.drp-date-picker__rolling-selector--visible~.drp-date-picker__weekdays,.drp-date-picker__rolling-selector.drp-date-picker__rolling-selector--visible~.drp-date-picker__days{visibility:hidden}.drp-date-picker__rolling-selector{gap:var(--drp-spacing-xs)}.drp-date-picker__rolling-list{flex:1;min-width:0;height:100%;overflow-y:auto;border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);display:flex;flex-direction:column;scroll-behavior:smooth}.drp-date-picker__rolling-list::-webkit-scrollbar{width:6px}.drp-date-picker__rolling-list::-webkit-scrollbar-track{background:var(--drp-primary-bg)}.drp-date-picker__rolling-list::-webkit-scrollbar-thumb{background:var(--drp-border-color);border-radius:3px}.drp-date-picker__rolling-list::-webkit-scrollbar-thumb:hover{background:var(--drp-accent-color)}.drp-date-picker__rolling-item{padding:.25rem 1rem;cursor:pointer;font-size:.875rem;min-height:calc(2rem * var(--drp-cell-scale));flex-shrink:0;display:flex;align-items:center;justify-content:var(--drp-rolling-item-justify-content, center)}.drp-date-picker__rolling-item:hover{background-color:#f3f4f6}.drp-date-picker__rolling-item--selected{background-color:#3b82f6;color:#fff;font-weight:600}.drp-date-picker__rolling-item--selected:hover{background-color:var(--drp-accent-color-hover)}.drp-date-picker__rolling-item-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;min-width:0}.drp-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--drp-spacing-xs);margin-bottom:var(--drp-spacing-sm)}.drp-date-picker__weekday{text-align:center;font-size:var(--drp-font-size-xs);font-weight:var(--drp-font-weight-semibold);color:var(--drp-text-secondary);padding:var(--drp-spacing-xs);text-transform:uppercase}.drp-date-picker__days{display:flex;flex-direction:column;gap:var(--drp-spacing-xs);margin-bottom:var(--drp-spacing-md)}.drp-date-picker__date-row{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--drp-spacing-xs)}.drp-date-picker__day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:var(--drp-font-size-sm);color:var(--drp-text-primary);border-radius:var(--drp-border-radius);cursor:pointer;border:calc(2px * var(--drp-cell-scale)) solid transparent;position:relative}.drp-date-picker__day:hover:not(.drp-date-picker__day--disabled):not(.drp-date-picker__day--other-month){background-color:var(--drp-primary-bg);border-color:var(--drp-accent-color)}.drp-date-picker__day--today{border-color:var(--drp-accent-color);font-weight:var(--drp-font-weight-semibold)}.drp-date-picker__day--selected{background-color:var(--drp-accent-color);color:var(--drp-accent-text-color);font-weight:var(--drp-font-weight-semibold)}.drp-date-picker__day--selected:hover{background-color:var(--drp-accent-color-hover)}.drp-date-picker__day--focused{outline:calc(2px * var(--drp-cell-scale)) solid var(--drp-accent-color);outline-offset:calc(2px * var(--drp-cell-scale))}.drp-date-picker__day--disabled{color:var(--drp-text-secondary);opacity:.6;cursor:not-allowed;position:relative}.drp-date-picker__day--disabled:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient(45deg,rgba(0,0,0,.1) 0px,rgba(0,0,0,.1) 1px,transparent 1px,transparent 6px);border-radius:var(--drp-border-radius);pointer-events:none}.drp-date-picker__day--disabled:hover{background-color:transparent;border-color:transparent}.drp-date-picker__day--other-month{color:var(--drp-text-secondary);opacity:.5}.drp-date-picker__day--other-month.drp-date-picker__day--range-start,.drp-date-picker__day--other-month.drp-date-picker__day--range-end,.drp-date-picker__day--other-month.drp-date-picker__day--in-range,.drp-date-picker__day--other-month.drp-date-picker__day--drag-preview{opacity:1}.drp-date-picker__day--range-start,.drp-date-picker__day--range-end{background-color:var(--drp-accent-color);color:var(--drp-accent-text-color);font-weight:var(--drp-font-weight-semibold);cursor:grab;-webkit-user-select:none;user-select:none}.drp-date-picker__day--range-start:active,.drp-date-picker__day--range-end:active{cursor:grabbing}.drp-date-picker__day--in-range{background-color:color-mix(in srgb,var(--drp-accent-color) 15%,transparent)}.drp-date-picker__day--in-range:hover{background-color:color-mix(in srgb,var(--drp-accent-color) 25%,transparent)}.drp-date-picker__day--dragging{cursor:grabbing!important;opacity:.7;transform:scale(1.1);transition:transform var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker__day--drag-preview{background-color:color-mix(in srgb,var(--drp-accent-color) 30%,transparent);border:calc(2px * var(--drp-cell-scale)) dashed var(--drp-accent-color)}.drp-date-picker__day--drag-preview.drp-date-picker__day--range-start,.drp-date-picker__day--drag-preview.drp-date-picker__day--range-end{background-color:color-mix(in srgb,var(--drp-accent-color) 60%,transparent);color:var(--drp-accent-text-color)}.drp-date-picker__day--drag-invalid{background-color:color-mix(in srgb,#ef4444 20%,transparent)!important;border-color:#ef4444!important;border-style:dashed!important}.drp-date-picker__day.holiday{background-color:color-mix(in srgb,#ef4444 10%,transparent)}.drp-date-picker__day.holiday:hover:not(.drp-date-picker__day--disabled){background-color:color-mix(in srgb,#ef4444 20%,transparent)}.drp-date-picker__day.event{background-color:color-mix(in srgb,#10b981 10%,transparent)}.drp-date-picker__day.event:hover:not(.drp-date-picker__day--disabled){background-color:color-mix(in srgb,#10b981 20%,transparent)}.drp-date-picker__rolling-item--disabled{color:var(--drp-text-secondary);opacity:.4;cursor:not-allowed;pointer-events:none;text-decoration:line-through}.drp-date-picker__rolling-item--disabled:hover{background-color:transparent}.drp-date-picker__badge-row{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--drp-spacing-xs);margin-bottom:var(--drp-spacing-xs);max-height:calc(1rem * var(--drp-cell-scale));min-height:calc(1rem * var(--drp-cell-scale))}.drp-date-picker__badge-cell{display:flex;align-items:center;justify-content:center;font-size:var(--drp-font-size-2xs);padding:calc(1px * var(--drp-cell-scale)) calc(2px * var(--drp-cell-scale));border-radius:2px;cursor:pointer;height:100%;max-height:calc(1rem * var(--drp-cell-scale))}.drp-date-picker__badge-cell:empty{visibility:hidden}.drp-date-picker__badge-cell:hover:not(:empty){transform:scale(1.05)}.drp-date-picker__badge-cell.badge-number{background-color:#10b981;color:#fff;font-size:.7rem;font-weight:600}.drp-date-picker__badge-cell.badge-count{background-color:#ef4444;color:#fff;font-size:.7rem;font-weight:700}.drp-date-picker__badge-cell.badge-text{background-color:#6b7280;color:#fff;font-size:.65rem;font-weight:700;text-transform:uppercase}.drp-date-picker__summary{text-align:center;padding:var(--drp-spacing-md);border-top:var(--drp-border-width-base) solid var(--drp-border-color);font-size:var(--drp-font-size-sm);color:var(--drp-text-secondary)}.drp-date-picker__summary--visible{display:block}.drp-date-picker__summary--hidden{display:none}.drp-date-picker__summary-count{font-weight:var(--drp-font-weight-semibold);color:var(--drp-accent-color);font-size:var(--drp-font-size-base)}.drp-date-picker__actions{display:flex;gap:var(--drp-spacing-sm);justify-content:space-between;padding-top:var(--drp-spacing-sm);border-top:var(--drp-border-width-base) solid var(--drp-border-color)}.drp-date-picker__button{flex:1;padding:var(--drp-spacing-sm) var(--drp-spacing-md);border:var(--drp-border-width-base) solid var(--drp-border-color);border-radius:var(--drp-border-radius);background:transparent;cursor:pointer;font-size:var(--drp-font-size-sm);font-weight:var(--drp-font-weight-medium)}.drp-date-picker__button:hover{background-color:var(--drp-primary-bg);border-color:var(--drp-accent-color)}.drp-date-picker__button:disabled,.drp-date-picker__button[disabled]{opacity:var(--drp-disabled-opacity, .6);cursor:not-allowed;pointer-events:none}.drp-date-picker__button:disabled:hover,.drp-date-picker__button[disabled]:hover{background-color:transparent;border-color:var(--drp-border-color)}.drp-date-picker__button--today{color:var(--drp-accent-color)}.drp-date-picker__button--clear{color:var(--drp-text-secondary)}.drp-date-picker__button--apply{background-color:var(--drp-accent-color);color:var(--drp-button-text-color);border-color:var(--drp-accent-color)}.drp-date-picker__button--apply:hover{background-color:var(--drp-accent-color-hover)}.drp-date-picker__button--cancel{color:var(--drp-text-secondary)}.drp-date-picker__tooltip{position:absolute;z-index:9999;background-color:var(--drp-tooltip-bg);color:var(--drp-tooltip-color);padding:var(--drp-spacing-xs) var(--drp-spacing-sm);border-radius:var(--drp-border-radius);font-size:var(--drp-font-size-xs);line-height:1.4;max-width:200px;word-wrap:break-word;pointer-events:none;opacity:0;transition:opacity var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker__tooltip--visible{opacity:1}.drp-date-picker__tooltip-arrow{position:absolute;background-color:var(--drp-tooltip-bg);width:8px;height:8px;transform:rotate(45deg)}.drp-date-picker__loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#fffc;display:flex;align-items:center;justify-content:center;z-index:9500;border-radius:.375rem}.drp-date-picker__loading-spinner{width:40px;height:40px;border:4px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:drp-spin .8s linear infinite}@keyframes drp-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.drp-date-picker.drp-font-xs{--drp-font-scale: .6}.drp-date-picker.drp-font-sm{--drp-font-scale: .8}.drp-date-picker.drp-font-md{--drp-font-scale: 1}.drp-date-picker.drp-font-lg{--drp-font-scale: 1.5}.drp-date-picker.drp-font-xl{--drp-font-scale: 2}.drp-date-picker.drp-spacing-xs{--drp-spacing-scale: .6}.drp-date-picker.drp-spacing-sm{--drp-spacing-scale: .8}.drp-date-picker.drp-spacing-md{--drp-spacing-scale: 1}.drp-date-picker.drp-spacing-lg{--drp-spacing-scale: 1.5}.drp-date-picker.drp-spacing-xl{--drp-spacing-scale: 2}.drp-date-picker.drp-cell-xs{--drp-cell-scale: .6}.drp-date-picker.drp-cell-sm{--drp-cell-scale: .8}.drp-date-picker.drp-cell-md{--drp-cell-scale: 1}.drp-date-picker.drp-cell-lg{--drp-cell-scale: 1.5}.drp-date-picker.drp-cell-xl{--drp-cell-scale: 2}@media (max-width: 1200px){.drp-responsive.drp-font-xl{--drp-font-scale: 1.5}}@media (max-width: 768px){.drp-responsive.drp-font-xl{--drp-font-scale: 1}}@media (max-width: 1200px){.drp-responsive.drp-font-lg{--drp-font-scale: 1}}@media (max-width: 768px){.drp-responsive.drp-font-lg{--drp-font-scale: .8}}@media (max-width: 768px){.drp-responsive.drp-font-md{--drp-font-scale: .8}}@media (max-width: 768px){.drp-responsive.drp-font-sm{--drp-font-scale: .6}}@media (max-width: 1200px){.drp-responsive.drp-spacing-xl{--drp-spacing-scale: 1.5}}@media (max-width: 768px){.drp-responsive.drp-spacing-xl{--drp-spacing-scale: 1}}@media (max-width: 1200px){.drp-responsive.drp-spacing-lg{--drp-spacing-scale: 1}}@media (max-width: 768px){.drp-responsive.drp-spacing-lg{--drp-spacing-scale: .8}}@media (max-width: 768px){.drp-responsive.drp-spacing-md{--drp-spacing-scale: .8}}@media (max-width: 768px){.drp-responsive.drp-spacing-sm{--drp-spacing-scale: .6}}@media (max-width: 1200px){.drp-responsive.drp-cell-xl{--drp-cell-scale: 1.5}}@media (max-width: 768px){.drp-responsive.drp-cell-xl{--drp-cell-scale: 1}}@media (max-width: 1200px){.drp-responsive.drp-cell-lg{--drp-cell-scale: 1}}@media (max-width: 768px){.drp-responsive.drp-cell-lg{--drp-cell-scale: .8}}@media (max-width: 768px){.drp-responsive.drp-cell-md{--drp-cell-scale: .8}}@media (max-width: 768px){.drp-responsive.drp-cell-sm{--drp-cell-scale: .6}}.drp-date-picker--xs{--drp-font-scale: .6;--drp-spacing-scale: .6;--drp-cell-scale: .6;min-width:168px}.drp-date-picker--sm{--drp-font-scale: .8;--drp-spacing-scale: .8;--drp-cell-scale: .8;min-width:224px}.drp-date-picker--lg{--drp-font-scale: 1.5;--drp-spacing-scale: 1.5;--drp-cell-scale: 1.5;min-width:420px}.drp-date-picker--xl{--drp-font-scale: 2;--drp-spacing-scale: 2;--drp-cell-scale: 2;min-width:560px}.drp-date-picker.drp-transitions-enabled .drp-date-picker__badge-cell{transition:transform var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker.drp-transitions-enabled .drp-date-picker__nav,.drp-date-picker.drp-transitions-enabled .drp-date-picker__action-btn{transition:background-color var(--drp-transition-fast) var(--drp-easing-snappy),border-color var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker.drp-transitions-enabled .drp-date-picker__month-year,.drp-date-picker.drp-transitions-enabled .drp-date-picker__rolling-item{transition:background-color var(--drp-transition-fast) var(--drp-easing-snappy)}.drp-date-picker--inline{position:static;display:block;box-shadow:none}
|