@igne-agency/react-web-ui 0.5.0 → 0.6.0

package/dist/lib/calendar/temporal.css

@@ -1,71 +1,136 @@
 @layer kit.reset, kit.base, kit.components;
 @layer kit.components {
-  ._group_zywoe_3 {
-    --field-fg: var(--sys-color-text);
-    --field-muted-fg: var(--sys-color-text-muted);
-    --field-placeholder-fg: var(--sys-color-text-placeholder);
+  ._group_1t1xp_3 {
+    --_field-fg: var(--field-fg, var(--sys-color-text));
+    --_field-muted-fg: var(
+    	--field-muted-fg,
+    	var(--sys-color-text-muted)
+    );
+    --_field-placeholder-fg: var(
+    	--field-placeholder-fg,
+    	var(--sys-color-text-placeholder)
+    );
+    --_field-caret: var(--field-caret, auto);
+  }
+  ._group_1t1xp_3 {
+    --_field-fill: var(
+    	--field-bg,
+    	var(--sys-color-surface)
+    );
     align-items: center;
     box-sizing: border-box;
-    min-block-size: calc(1lh + 2 * var(--sys-unit-6) + 2 * 1px);
-    border: 1px solid var(--sys-color-border);
-    border-radius: var(--sys-radius-sm);
-    background: var(--sys-color-surface);
-    padding: var(--sys-unit-6);
-    color: var(--field-fg);
-    font: var(--sys-font-body-medium);
-  }
-  ._group_zywoe_3 {
-    outline: 0 solid var(--sys-color-focus-ring);
-    outline-offset: var(--sys-focus-ring-offset);
-  }
-  ._group_zywoe_3[data-focus-visible] {
-    outline-width: var(--sys-focus-ring-width);
+    min-block-size: var(--field-min-block-size, calc(1lh + 2 * var(--field-pad-y, var(--sys-unit-6)) + 2 * var(--field-border-width, 1px)));
+    border: var(--field-border-width, 1px) solid var(--field-border, var(--sys-color-border));
+    border-radius: var(--field-radius, var(--sys-radius-sm));
+    background: var(--_field-fill);
+    padding-block: var(--field-pad-y, var(--sys-unit-6));
+    padding-inline: var(--field-pad-start, var(--field-pad-x, var(--sys-unit-6))) var(--field-pad-end, var(--field-pad-x, var(--sys-unit-6)));
+    box-shadow: var(--field-shadow, none);
+    color: var(--_field-fg);
+    font: var(--field-font, var(--sys-font-body-medium));
+    caret-color: var(--_field-caret);
+    backdrop-filter: var(--field-backdrop-filter, none);
+  }
+  ._group_1t1xp_3 {
+    outline: 0 solid var(--field-ring-color, var(--sys-color-focus-ring));
+    outline-offset: var(--field-ring-offset, var(--sys-focus-ring-offset));
+  }
+  ._group_1t1xp_3[data-focus-visible] {
+    outline-width: var(--field-ring-width, var(--sys-focus-ring-width));
   }
   @media not (prefers-reduced-motion) {
-    ._group_zywoe_3 {
-      transition: border-color var(--sys-motion-instant) var(--sys-motion-standard), background var(--sys-motion-instant) var(--sys-motion-standard);
+    ._group_1t1xp_3 {
+      transition: border-color var(--sys-motion-instant) var(--sys-motion-standard), background var(--sys-motion-instant) var(--sys-motion-standard), box-shadow var(--sys-motion-instant) var(--sys-motion-standard);
     }
   }
-  ._group_zywoe_3:hover:not([data-disabled], [data-readonly]), ._group_zywoe_3[data-focused], ._group_zywoe_3[data-popup-open] {
-    border-color: var(--sys-color-primary);
+  ._group_1t1xp_3:hover:not([data-disabled],
+  [data-readonly],
+  [data-focused],
+  [data-popup-open]) {
+    border-color: var(--field-hover-border, var(--sys-color-primary));
+  }
+  ._group_1t1xp_3[data-focused], ._group_1t1xp_3[data-popup-open] {
+    border-width: var(--field-focus-border-width, var(--field-border-width, 1px));
+    border-color: var(--field-focus-border, var(--sys-color-primary));
+    box-shadow: var(--field-focus-shadow, var(--field-shadow, none));
+  }
+  ._group_1t1xp_3:has(:autofill) {
+    --_field-fill: var(
+    	--field-autofill-bg,
+    	var(--sys-color-autofill-bg)
+    );
   }
-  ._group_zywoe_3[data-readonly] {
-    --field-fg: var(--sys-color-text);
-    border-style: dashed;
-    border-color: var(--sys-color-outline);
-    background: var(--sys-color-surface-high);
-    color: var(--field-fg);
+  ._group_1t1xp_3[data-readonly] {
+    --_field-fg: var(
+    	--field-readonly-fg,
+    	var(--sys-color-text)
+    );
+    --_field-fill: var(
+    	--field-readonly-bg,
+    	var(--sys-color-surface-high)
+    );
+    border-style: var(--field-readonly-border-style, dashed);
+    border-color: var(--field-readonly-border, var(--sys-color-outline));
+    background: var(--_field-fill);
+    color: var(--_field-fg);
   }
-  ._group_zywoe_3[data-pending] {
+  ._group_1t1xp_3[data-pending] {
     cursor: progress;
-    caret-color: var(--sys-color-text-muted);
-  }
-  ._group_zywoe_3[data-invalid] {
-    --field-fg: var(--sys-color-error-fg);
-    --field-muted-fg: var(--sys-color-error-fg);
-    --field-placeholder-fg: var(--sys-color-error-fg);
-    border-color: var(--sys-color-error-fg);
-    background-color: var(--sys-color-error-bg);
-    color: var(--field-fg);
-  }
-  ._group_zywoe_3[data-disabled] {
-    --field-fg: var(--sys-color-disabled-fg);
-    --field-muted-fg: var(--sys-color-disabled-fg);
-    --field-placeholder-fg: var(--sys-color-disabled-fg);
-    color: var(--sys-color-disabled-fg);
+    caret-color: var(--field-pending-caret, var(--sys-color-text-muted));
+  }
+  ._group_1t1xp_3[data-invalid] {
+    --_field-fg: var(
+    	--field-invalid-fg,
+    	var(--sys-color-error-fg)
+    );
+    --_field-muted-fg: var(
+    	--field-invalid-muted-fg,
+    	var(--field-invalid-fg, var(--sys-color-error-fg))
+    );
+    --_field-placeholder-fg: var(
+    	--field-invalid-placeholder-fg,
+    	var(--field-invalid-fg, var(--sys-color-error-fg))
+    );
+    --_field-fill: var(
+    	--field-invalid-bg,
+    	var(--sys-color-error-bg)
+    );
+    border-color: var(--field-invalid-border, var(--sys-color-error-fg));
+    background-color: var(--_field-fill);
+    color: var(--_field-fg);
+    border-width: var(--field-invalid-border-width, var(--field-border-width, 1px));
+    box-shadow: var(--field-invalid-shadow, var(--field-shadow, none));
+  }
+  ._group_1t1xp_3[data-disabled] {
+    --_field-fg: var(
+    	--field-disabled-fg,
+    	var(--sys-color-disabled-fg)
+    );
+    --_field-muted-fg: var(
+    	--field-disabled-muted-fg,
+    	var(--field-disabled-fg, var(--sys-color-disabled-fg))
+    );
+    --_field-placeholder-fg: var(
+    	--field-disabled-placeholder-fg,
+    	var(--field-disabled-fg, var(--sys-color-disabled-fg))
+    );
+    color: var(--field-disabled-fg, var(--sys-color-disabled-fg));
     cursor: not-allowed;
-    background: var(--sys-color-disabled-bg);
+    --_field-fill: var(
+    	--field-disabled-bg,
+    	var(--sys-color-disabled-bg)
+    );
   }
-  ._group_zywoe_3 {
+  ._group_1t1xp_3 {
     position: relative;
     display: flex;
-    gap: var(--sys-unit-4);
+    gap: var(--field-inlay-gap, var(--sys-unit-4));
   }
-  ._group_zywoe_3 {
+  ._group_1t1xp_3 {
     inline-size: 100%;
     min-inline-size: 0;
   }
-  ._input_zywoe_68 {
+  ._input_1t1xp_133 {
     display: flex;
     flex: 1;
     align-items: center;
@@ -78,7 +143,7 @@
     white-space: nowrap;
     line-height: normal;
   }
-  ._rangeInput_zywoe_81 {
+  ._rangeInput_1t1xp_146 {
     display: flex;
     flex: none;
     align-items: center;
@@ -90,38 +155,38 @@
     white-space: nowrap;
     line-height: normal;
   }
-  ._rangeSeparator_zywoe_93 {
+  ._rangeSeparator_1t1xp_158 {
     flex: none;
-    color: var(--field-muted-fg);
+    color: var(--_field-muted-fg);
   }
-  ._rangeSpacer_zywoe_97 {
+  ._rangeSpacer_1t1xp_162 {
     flex: 1;
     min-inline-size: 0;
   }
-  ._segment_zywoe_101 {
+  ._segment_1t1xp_166 {
     border-radius: var(--temporal-segment-radius, var(--sys-radius-xs));
-    padding-inline: 1px;
+    padding-inline: var(--temporal-segment-pad-x, 1px);
     font-variant-numeric: tabular-nums;
   }
-  ._segment_zywoe_101[data-placeholder] {
-    color: var(--field-placeholder-fg);
+  ._segment_1t1xp_166[data-placeholder] {
+    color: var(--_field-placeholder-fg);
   }
-  ._segment_zywoe_101[data-type=literal] {
-    padding-inline: 0;
-    color: var(--field-muted-fg);
+  ._segment_1t1xp_166[data-type=literal] {
+    padding-inline: var(--temporal-segment-literal-pad-x, 0);
+    color: var(--_field-muted-fg);
   }
-  ._segment_zywoe_101[data-focused] {
+  ._segment_1t1xp_166[data-focused] {
     background: var(--temporal-segment-focused-bg, var(--sys-color-primary-container));
     color: var(--temporal-segment-focused-fg, var(--sys-color-on-primary-container));
   }
-  ._trigger_zywoe_117 {
+  ._trigger_1t1xp_182 {
     position: relative;
     flex: none;
-    margin-block: calc(-1 * var(--sys-unit-6));
+    margin-block: calc(-1 * var(--field-pad-y, var(--sys-unit-6)));
     cursor: pointer;
   }
   @media (any-pointer: coarse) {
-    ._trigger_zywoe_117::before {
+    ._trigger_1t1xp_182::before {
       content: "";
       position: absolute;
       inset: 50%;
@@ -130,89 +195,89 @@
       block-size: var(--sys-unit-22);
     }
   }
-  ._popover_zywoe_133 {
+  ._popover_1t1xp_198 {
     box-sizing: border-box;
     border: none;
-    border-radius: var(--sys-radius-md);
-    background: var(--sys-color-surface-overlay);
-    padding: var(--sys-unit-4);
-    color: var(--sys-color-text);
+    border-radius: var(--popup-radius, var(--sys-radius-md));
+    background: var(--popup-bg, var(--sys-color-surface-overlay));
+    padding: var(--popup-pad, var(--sys-unit-4));
+    color: var(--popup-fg, var(--sys-color-text));
     transform-origin: var(--transform-origin);
     scrollbar-width: thin;
-    scrollbar-color: var(--sys-color-outline) transparent;
-    box-shadow: var(--sys-elevation-1);
+    scrollbar-color: var(--popup-scrollbar-fg, var(--sys-color-outline)) transparent;
+    box-shadow: var(--popup-shadow, var(--sys-elevation-1));
   }
   @media not (prefers-reduced-motion) {
-    ._popover_zywoe_133 {
+    ._popover_1t1xp_198 {
       transition: opacity var(--sys-motion-instant) var(--sys-motion-standard), transform var(--sys-motion-instant) var(--sys-motion-standard);
     }
   }
-  ._popover_zywoe_133[data-starting-style], ._popover_zywoe_133[data-ending-style] {
+  ._popover_1t1xp_198[data-starting-style], ._popover_1t1xp_198[data-ending-style] {
     opacity: 0;
     transform: scale(0.96);
   }
-  ._popover_zywoe_133 {
+  ._popover_1t1xp_198 {
     inline-size: max-content;
   }
   @media not (prefers-reduced-motion) {
-    ._popover_zywoe_133[data-entering], ._popover_zywoe_133[data-exiting] {
+    ._popover_1t1xp_198[data-entering], ._popover_1t1xp_198[data-exiting] {
       opacity: 0;
       transform: scale(0.96);
     }
   }
-  ._dialog_zywoe_163 {
+  ._dialog_1t1xp_228 {
     outline: none;
   }
-  ._calendar_zywoe_166 {
+  ._calendar_1t1xp_231 {
     display: flex;
     flex-direction: column;
     gap: var(--calendar-gap, var(--sys-unit-4));
   }
-  ._header_zywoe_171 {
+  ._header_1t1xp_236 {
     display: flex;
     align-items: center;
-    gap: var(--sys-unit-2);
+    gap: var(--calendar-header-gap, var(--sys-unit-2));
   }
-  ._navigation_zywoe_176 {
+  ._navigation_1t1xp_241 {
     position: relative;
     z-index: 1;
     display: flex;
     flex: 1;
     align-items: center;
     justify-content: center;
-    gap: var(--sys-unit-2);
+    gap: var(--calendar-nav-gap, var(--sys-unit-2));
     min-inline-size: 0;
   }
-  ._navField_zywoe_186 {
+  ._navField_1t1xp_251 {
     display: contents;
   }
-  ._navPortal_zywoe_189 {
+  ._navPortal_1t1xp_254 {
     position: absolute;
     inset-block-start: 0;
     inset-inline-start: 0;
   }
-  ._navTrigger_zywoe_194,
-  ._navControl_zywoe_195 {
+  ._navTrigger_1t1xp_259,
+  ._navControl_1t1xp_260 {
     display: inline-flex;
     align-items: center;
-    gap: var(--sys-unit-2);
+    gap: var(--calendar-nav-trigger-gap, var(--sys-unit-2));
     box-sizing: border-box;
-    min-block-size: var(--sys-unit-22);
+    min-block-size: var(--calendar-nav-trigger-min-block-size, var(--sys-unit-22));
     border: none;
-    border-radius: var(--sys-radius-sm);
+    border-radius: var(--calendar-nav-trigger-radius, var(--sys-radius-sm));
     background: none;
-    padding-inline: var(--sys-unit-4);
-    color: var(--sys-color-text);
-    font: var(--sys-font-label-large);
+    padding-inline: var(--calendar-nav-trigger-pad-x, var(--sys-unit-4));
+    color: var(--calendar-nav-trigger-fg, var(--sys-color-text));
+    font: var(--calendar-nav-trigger-font, var(--sys-font-label-large));
     cursor: pointer;
   }
-  ._navTrigger_zywoe_194,
-  ._navControl_zywoe_195 {
+  ._navTrigger_1t1xp_259,
+  ._navControl_1t1xp_260 {
     position: relative;
     isolation: isolate;
   }
-  ._navTrigger_zywoe_194::after,
-  ._navControl_zywoe_195::after {
+  ._navTrigger_1t1xp_259::after,
+  ._navControl_1t1xp_260::after {
     content: "";
     position: absolute;
     z-index: -1;
@@ -223,53 +288,53 @@
     pointer-events: none;
   }
   @media not (prefers-reduced-motion) {
-    ._navTrigger_zywoe_194::after,
-    ._navControl_zywoe_195::after {
+    ._navTrigger_1t1xp_259::after,
+    ._navControl_1t1xp_260::after {
       transition: opacity var(--sys-motion-instant) var(--sys-motion-standard);
     }
   }
-  ._navTrigger_zywoe_194:hover:not(:disabled, [data-disabled])::after,
-  ._navControl_zywoe_195:hover:not(:disabled, [data-disabled])::after {
+  ._navTrigger_1t1xp_259:hover:not(:disabled, [data-disabled])::after,
+  ._navControl_1t1xp_260:hover:not(:disabled, [data-disabled])::after {
     opacity: var(--sys-state-hover);
   }
-  ._navTrigger_zywoe_194:active:not(:disabled, [data-disabled])::after,
-  ._navControl_zywoe_195:active:not(:disabled, [data-disabled])::after {
+  ._navTrigger_1t1xp_259:active:not(:disabled, [data-disabled])::after,
+  ._navControl_1t1xp_260:active:not(:disabled, [data-disabled])::after {
     opacity: var(--sys-state-pressed);
   }
-  ._navTrigger_zywoe_194,
-  ._navControl_zywoe_195 {
+  ._navTrigger_1t1xp_259,
+  ._navControl_1t1xp_260 {
     outline: 0 solid var(--sys-color-focus-ring);
     outline-offset: var(--sys-focus-ring-offset);
   }
-  ._navTrigger_zywoe_194,
-  ._navControl_zywoe_195 {
+  ._navTrigger_1t1xp_259,
+  ._navControl_1t1xp_260 {
     line-height: normal;
   }
-  ._navTrigger_zywoe_194:focus-visible {
+  ._navTrigger_1t1xp_259:focus-visible {
     outline-width: var(--sys-focus-ring-width);
   }
-  ._navControl_zywoe_195:has(._navInput_zywoe_251:focus-visible) {
+  ._navControl_1t1xp_260:has(._navInput_1t1xp_316:focus-visible) {
     outline-width: var(--sys-focus-ring-width);
   }
-  ._navLabel_zywoe_254 {
+  ._navLabel_1t1xp_319 {
     display: grid;
     min-inline-size: 0;
   }
-  ._navSizer_zywoe_258 {
+  ._navSizer_1t1xp_323 {
     display: grid;
     visibility: hidden;
     pointer-events: none;
   }
-  ._navLabel_zywoe_254 > *,
-  ._navSizer_zywoe_258 > * {
+  ._navLabel_1t1xp_319 > *,
+  ._navSizer_1t1xp_323 > * {
     grid-area: 1/1;
     white-space: nowrap;
   }
-  ._navValue_zywoe_268 {
+  ._navValue_1t1xp_333 {
     overflow: hidden;
     text-overflow: ellipsis;
   }
-  ._navInput_zywoe_251 {
+  ._navInput_1t1xp_316 {
     align-self: stretch;
     inline-size: 5ch;
     border: none;
@@ -282,20 +347,20 @@
     outline: none;
     line-height: normal;
   }
-  ._navChevron_zywoe_285 {
+  ._navChevron_1t1xp_350 {
     display: inline-flex;
     flex-shrink: 0;
     align-items: center;
     align-self: stretch;
-    color: var(--sys-color-text-muted);
+    color: var(--calendar-nav-trigger-icon-fg, var(--sys-color-text-muted));
     cursor: pointer;
   }
-  ._navIcon_zywoe_293 {
+  ._navIcon_1t1xp_358 {
     display: inline-flex;
     flex-shrink: 0;
-    color: var(--sys-color-text-muted);
+    color: var(--calendar-nav-trigger-icon-fg, var(--sys-color-text-muted));
   }
-  ._navPositioner_zywoe_298 {
+  ._navPositioner_1t1xp_363 {
     --_popup-edge-padding: var(
     	--popup-edge-padding,
     	var(--sys-unit-16)
@@ -306,105 +371,106 @@
     inherits: false;
     initial-value: 0px;
   }
-  ._navPositioner_zywoe_298 {
+  ._navPositioner_1t1xp_363 {
     outline: none;
   }
-  ._navPopup_zywoe_312 {
+  ._navPopup_1t1xp_377 {
     box-sizing: border-box;
     border: none;
-    border-radius: var(--sys-radius-md);
-    background: var(--sys-color-surface-overlay);
-    padding: var(--sys-unit-4);
-    color: var(--sys-color-text);
+    border-radius: var(--popup-radius, var(--sys-radius-md));
+    background: var(--popup-bg, var(--sys-color-surface-overlay));
+    padding: var(--popup-pad, var(--sys-unit-4));
+    color: var(--popup-fg, var(--sys-color-text));
     transform-origin: var(--transform-origin);
     scrollbar-width: thin;
-    scrollbar-color: var(--sys-color-outline) transparent;
-    box-shadow: var(--sys-elevation-1);
+    scrollbar-color: var(--popup-scrollbar-fg, var(--sys-color-outline)) transparent;
+    box-shadow: var(--popup-shadow, var(--sys-elevation-1));
   }
   @media not (prefers-reduced-motion) {
-    ._navPopup_zywoe_312 {
+    ._navPopup_1t1xp_377 {
       transition: opacity var(--sys-motion-instant) var(--sys-motion-standard), transform var(--sys-motion-instant) var(--sys-motion-standard);
     }
   }
-  ._navPopup_zywoe_312[data-starting-style], ._navPopup_zywoe_312[data-ending-style] {
+  ._navPopup_1t1xp_377[data-starting-style], ._navPopup_1t1xp_377[data-ending-style] {
     opacity: 0;
     transform: scale(0.96);
   }
-  ._navPopup_zywoe_312 {
+  ._navPopup_1t1xp_377 {
     max-block-size: var(--available-height);
     overflow-y: auto;
   }
-  ._yearPopup_zywoe_337 {
+  ._yearPopup_1t1xp_402 {
     box-sizing: border-box;
     border: none;
-    border-radius: var(--sys-radius-md);
-    background: var(--sys-color-surface-overlay);
-    padding: var(--sys-unit-4);
-    color: var(--sys-color-text);
+    border-radius: var(--popup-radius, var(--sys-radius-md));
+    background: var(--popup-bg, var(--sys-color-surface-overlay));
+    padding: var(--popup-pad, var(--sys-unit-4));
+    color: var(--popup-fg, var(--sys-color-text));
     transform-origin: var(--transform-origin);
     scrollbar-width: thin;
-    scrollbar-color: var(--sys-color-outline) transparent;
-    box-shadow: var(--sys-elevation-1);
+    scrollbar-color: var(--popup-scrollbar-fg, var(--sys-color-outline)) transparent;
+    box-shadow: var(--popup-shadow, var(--sys-elevation-1));
   }
   @media not (prefers-reduced-motion) {
-    ._yearPopup_zywoe_337 {
+    ._yearPopup_1t1xp_402 {
       transition: opacity var(--sys-motion-instant) var(--sys-motion-standard), transform var(--sys-motion-instant) var(--sys-motion-standard);
     }
   }
-  ._yearPopup_zywoe_337[data-starting-style], ._yearPopup_zywoe_337[data-ending-style] {
+  ._yearPopup_1t1xp_402[data-starting-style], ._yearPopup_1t1xp_402[data-ending-style] {
     opacity: 0;
     transform: scale(0.96);
   }
-  ._yearPopup_zywoe_337 {
+  ._yearPopup_1t1xp_402 {
     display: flex;
     flex-direction: column;
     min-inline-size: var(--anchor-width);
     max-inline-size: var(--available-width);
-    max-block-size: min(var(--available-height, 22rem), 22rem);
+    max-block-size: min(var(--available-height, 22rem), var(--calendar-year-popup-max-block-size, 22rem));
   }
-  ._yearEmpty_zywoe_365 {
+  ._yearEmpty_1t1xp_430 {
     display: flex;
     flex-shrink: 0;
     align-items: center;
-    gap: var(--sys-unit-4);
+    gap: var(--popup-note-gap, var(--sys-unit-4));
     contain: inline-size;
     min-block-size: 1lh;
-    padding: var(--sys-unit-4) var(--sys-unit-6);
-    color: var(--sys-color-text-muted);
-    font: var(--sys-font-body-medium);
+    padding: var(--popup-note-pad-y, var(--sys-unit-4)) var(--popup-note-pad-x, var(--sys-unit-6));
+    color: var(--popup-note-fg, var(--sys-color-text-muted));
+    font: var(--popup-note-font, var(--sys-font-body-medium));
   }
-  ._yearEmpty_zywoe_365:empty {
+  ._yearEmpty_1t1xp_430:empty {
     min-block-size: 0;
     padding: 0;
   }
-  ._yearList_zywoe_380 {
+  ._yearList_1t1xp_445 {
     min-block-size: 0;
     overflow-y: auto;
     overscroll-behavior: contain;
     scroll-padding-block: var(--sys-unit-4);
     scrollbar-width: thin;
-    scrollbar-color: var(--sys-color-outline) transparent;
+    scrollbar-color: var(--popup-scrollbar-fg, var(--sys-color-outline)) transparent;
   }
-  ._navItem_zywoe_388,
-  ._yearOption_zywoe_389 {
+  ._navItem_1t1xp_453,
+  ._yearOption_1t1xp_454 {
     display: flex;
     align-items: center;
-    gap: var(--sys-unit-6);
+    gap: var(--popup-item-gap, var(--sys-unit-6));
     box-sizing: border-box;
-    min-block-size: var(--sys-unit-20);
-    border-radius: var(--sys-radius-sm);
-    padding: var(--sys-unit-4) var(--sys-unit-6);
-    color: var(--sys-color-text);
-    font: var(--sys-font-body-medium);
+    min-block-size: var(--popup-item-min-block-size, var(--sys-unit-20));
+    border-radius: var(--popup-item-radius, var(--sys-radius-sm));
+    background: var(--popup-item-bg, transparent);
+    padding: var(--popup-item-pad-y, var(--sys-unit-4)) var(--popup-item-pad-x, var(--sys-unit-6));
+    color: var(--popup-item-fg, var(--popup-fg, var(--sys-color-text)));
+    font: var(--popup-item-font, var(--sys-font-body-medium));
     user-select: none;
   }
-  ._navItem_zywoe_388,
-  ._yearOption_zywoe_389 {
+  ._navItem_1t1xp_453,
+  ._yearOption_1t1xp_454 {
     position: relative;
     isolation: isolate;
   }
-  ._navItem_zywoe_388::after,
-  ._yearOption_zywoe_389::after {
+  ._navItem_1t1xp_453::after,
+  ._yearOption_1t1xp_454::after {
     content: "";
     position: absolute;
     z-index: -1;
@@ -415,53 +481,58 @@
     pointer-events: none;
   }
   @media not (prefers-reduced-motion) {
-    ._navItem_zywoe_388::after,
-    ._yearOption_zywoe_389::after {
+    ._navItem_1t1xp_453::after,
+    ._yearOption_1t1xp_454::after {
       transition: opacity var(--sys-motion-instant) var(--sys-motion-standard);
     }
   }
-  ._navItem_zywoe_388:hover:not(:disabled, [data-disabled])::after,
-  ._yearOption_zywoe_389:hover:not(:disabled, [data-disabled])::after {
+  ._navItem_1t1xp_453:hover:not(:disabled, [data-disabled])::after,
+  ._yearOption_1t1xp_454:hover:not(:disabled, [data-disabled])::after {
     opacity: var(--sys-state-hover);
   }
-  ._navItem_zywoe_388:active:not(:disabled, [data-disabled])::after,
-  ._yearOption_zywoe_389:active:not(:disabled, [data-disabled])::after {
+  ._navItem_1t1xp_453:active:not(:disabled, [data-disabled])::after,
+  ._yearOption_1t1xp_454:active:not(:disabled, [data-disabled])::after {
     opacity: var(--sys-state-pressed);
   }
-  ._navItem_zywoe_388,
-  ._yearOption_zywoe_389 {
+  ._navItem_1t1xp_453,
+  ._yearOption_1t1xp_454 {
     outline: none;
   }
-  ._navItem_zywoe_388[data-highlighted],
-  ._yearOption_zywoe_389[data-highlighted] {
-    background: var(--sys-color-primary-container);
-    color: var(--sys-color-on-primary-container);
+  ._navItem_1t1xp_453[data-selected],
+  ._yearOption_1t1xp_454[data-selected] {
+    background: var(--popup-item-selected-bg, var(--popup-item-bg, transparent));
+    color: var(--popup-item-selected-fg, var(--popup-item-fg, var(--popup-fg, var(--sys-color-text))));
+  }
+  ._navItem_1t1xp_453[data-highlighted],
+  ._yearOption_1t1xp_454[data-highlighted] {
+    background: var(--popup-item-highlighted-bg, var(--sys-color-primary-container));
+    color: var(--popup-item-highlighted-fg, var(--sys-color-on-primary-container));
   }
-  ._navItem_zywoe_388[data-disabled],
-  ._yearOption_zywoe_389[data-disabled] {
-    color: var(--sys-color-disabled-fg);
+  ._navItem_1t1xp_453[data-disabled],
+  ._yearOption_1t1xp_454[data-disabled] {
+    color: var(--popup-item-disabled-fg, var(--sys-color-disabled-fg));
   }
-  ._navItemIndicator_zywoe_444,
-  ._yearIndicator_zywoe_445 {
+  ._navItemIndicator_1t1xp_515,
+  ._yearIndicator_1t1xp_516 {
     display: inline-flex;
     flex: none;
     align-items: center;
     justify-content: center;
     inline-size: 1lh;
-    color: var(--sys-color-primary);
+    color: var(--calendar-nav-indicator-fg, var(--sys-color-primary));
   }
-  ._yearValue_zywoe_453 {
+  ._yearValue_1t1xp_524 {
     min-inline-size: 4ch;
     font-variant-numeric: tabular-nums;
   }
-  ._months_zywoe_457 {
+  ._months_1t1xp_528 {
     display: grid;
     grid-auto-flow: column;
     grid-auto-columns: 1fr;
     gap: var(--calendar-months-gap, var(--sys-unit-8));
     align-items: start;
   }
-  ._grid_zywoe_464 {
+  ._grid_1t1xp_535 {
     --_calendar-cell-size: var(
     	--calendar-cell-size,
     	var(--sys-unit-20)
@@ -470,18 +541,18 @@
     table-layout: fixed;
     min-inline-size: calc(7 * var(--_calendar-cell-size));
   }
-  ._grid_zywoe_464 td,
-  ._grid_zywoe_464 th {
+  ._grid_1t1xp_535 td,
+  ._grid_1t1xp_535 th {
     padding: 0;
   }
-  ._weekday_zywoe_477 {
-    padding-block: var(--sys-unit-2);
-    color: var(--sys-color-text-muted);
-    font: var(--sys-font-label-small);
-    font-weight: normal;
+  ._weekday_1t1xp_548 {
+    padding-block: var(--calendar-weekday-pad-y, var(--sys-unit-2));
+    color: var(--calendar-weekday-fg, var(--sys-color-text-muted));
+    font: var(--calendar-weekday-font, var(--sys-font-label-small));
+    font-weight: var(--calendar-weekday-font-weight, normal);
     text-align: center;
   }
-  ._day_zywoe_484 {
+  ._day_1t1xp_555 {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -490,16 +561,16 @@
     inline-size: var(--_calendar-cell-size);
     block-size: var(--_calendar-cell-size);
     border-radius: var(--calendar-day-radius, var(--sys-radius-circle));
-    color: var(--sys-color-text);
-    font: var(--sys-font-body-medium);
+    color: var(--calendar-day-fg, var(--sys-color-text));
+    font: var(--calendar-day-font, var(--sys-font-body-medium));
     font-variant-numeric: tabular-nums;
     user-select: none;
   }
-  ._day_zywoe_484 {
+  ._day_1t1xp_555 {
     position: relative;
     isolation: isolate;
   }
-  ._day_zywoe_484::after {
+  ._day_1t1xp_555::after {
     content: "";
     position: absolute;
     z-index: -1;
@@ -510,87 +581,109 @@
     pointer-events: none;
   }
   @media not (prefers-reduced-motion) {
-    ._day_zywoe_484::after {
+    ._day_1t1xp_555::after {
       transition: opacity var(--sys-motion-instant) var(--sys-motion-standard);
     }
   }
-  ._day_zywoe_484:hover:not(:disabled, [data-disabled])::after {
+  ._day_1t1xp_555:hover:not(:disabled, [data-disabled])::after {
     opacity: var(--sys-state-hover);
   }
-  ._day_zywoe_484:active:not(:disabled, [data-disabled])::after {
+  ._day_1t1xp_555:active:not(:disabled, [data-disabled])::after {
     opacity: var(--sys-state-pressed);
   }
-  ._day_zywoe_484 {
+  ._day_1t1xp_555 {
     outline: 0 solid var(--sys-color-focus-ring);
     outline-offset: var(--sys-focus-ring-offset);
   }
-  ._day_zywoe_484[data-focus-visible] {
+  ._day_1t1xp_555[data-focus-visible] {
     outline-width: var(--sys-focus-ring-width);
   }
-  ._day_zywoe_484[data-outside-month] {
-    color: var(--sys-color-text-muted);
+  ._day_1t1xp_555[data-outside-month] {
+    color: var(--calendar-outside-month-fg, var(--sys-color-text-muted));
   }
-  ._day_zywoe_484._today_zywoe_533::before {
+  ._day_1t1xp_555._today_1t1xp_604::before {
     content: "";
     position: absolute;
     inset-block-end: var(--sys-unit-1);
-    inline-size: var(--sys-unit-3);
-    block-size: var(--sys-unit-3);
-    border-radius: var(--sys-radius-circle);
-    background: currentcolor;
+    inline-size: var(--calendar-today-mark-size, var(--sys-unit-3));
+    block-size: var(--calendar-today-mark-size, var(--sys-unit-3));
+    border-radius: var(--calendar-today-mark-radius, var(--sys-radius-circle));
+    background: var(--calendar-today-mark-bg, currentcolor);
   }
-  ._day_zywoe_484[data-selected] {
+  ._day_1t1xp_555[data-selected] {
     background: var(--calendar-selected-bg, var(--sys-color-primary));
     color: var(--calendar-selected-fg, var(--sys-color-on-primary));
-    font-weight: 700;
+    font-weight: var(--calendar-selected-font-weight, 700);
   }
-  ._rangeCalendar_zywoe_547 ._day_zywoe_484[data-selected]:not([data-selection-start],
+  ._rangeCalendar_1t1xp_618 ._day_1t1xp_555[data-selected]:not([data-selection-start],
   [data-selection-end]) {
-    border-radius: var(--sys-radius-none);
+    border-radius: var(--calendar-range-radius, var(--sys-radius-none));
     background: none;
     color: var(--calendar-range-fg, var(--sys-color-on-primary-container));
-    font-weight: 600;
+    font-weight: var(--calendar-range-font-weight, 600);
   }
-  ._day_zywoe_484[data-unavailable] {
-    color: var(--sys-color-text-muted);
+  ._day_1t1xp_555[data-unavailable] {
+    color: var(--calendar-unavailable-fg, var(--sys-color-text-muted));
     text-decoration: line-through;
   }
-  ._day_zywoe_484[data-disabled] {
-    --field-fg: var(--sys-color-disabled-fg);
-    --field-muted-fg: var(--sys-color-disabled-fg);
-    --field-placeholder-fg: var(--sys-color-disabled-fg);
-    color: var(--sys-color-disabled-fg);
+  ._day_1t1xp_555[data-disabled] {
+    --_field-fg: var(
+    	--field-disabled-fg,
+    	var(--sys-color-disabled-fg)
+    );
+    --_field-muted-fg: var(
+    	--field-disabled-muted-fg,
+    	var(--field-disabled-fg, var(--sys-color-disabled-fg))
+    );
+    --_field-placeholder-fg: var(
+    	--field-disabled-placeholder-fg,
+    	var(--field-disabled-fg, var(--sys-color-disabled-fg))
+    );
+    color: var(--field-disabled-fg, var(--sys-color-disabled-fg));
     cursor: not-allowed;
   }
-  ._day_zywoe_484[data-disabled][data-selected] {
-    background: var(--sys-color-disabled-fg);
-    color: var(--sys-color-disabled-bg);
+  ._day_1t1xp_555[data-disabled][data-selected] {
+    background: var(--calendar-disabled-selected-bg, var(--sys-color-disabled-fg));
+    color: var(--calendar-disabled-selected-fg, var(--sys-color-disabled-bg));
   }
-  ._day_zywoe_484[data-invalid] {
-    --field-fg: var(--sys-color-error-fg);
-    --field-muted-fg: var(--sys-color-error-fg);
-    --field-placeholder-fg: var(--sys-color-error-fg);
-    border-color: var(--sys-color-error-fg);
-    background-color: var(--sys-color-error-bg);
-    color: var(--field-fg);
+  ._day_1t1xp_555[data-invalid] {
+    --_field-fg: var(
+    	--field-invalid-fg,
+    	var(--sys-color-error-fg)
+    );
+    --_field-muted-fg: var(
+    	--field-invalid-muted-fg,
+    	var(--field-invalid-fg, var(--sys-color-error-fg))
+    );
+    --_field-placeholder-fg: var(
+    	--field-invalid-placeholder-fg,
+    	var(--field-invalid-fg, var(--sys-color-error-fg))
+    );
+    --_field-fill: var(
+    	--field-invalid-bg,
+    	var(--sys-color-error-bg)
+    );
+    border-color: var(--field-invalid-border, var(--sys-color-error-fg));
+    background-color: var(--_field-fill);
+    color: var(--_field-fg);
   }
-  ._rangeCalendar_zywoe_547 ._grid_zywoe_464 td {
+  ._rangeCalendar_1t1xp_618 ._grid_1t1xp_535 td {
     background-image: linear-gradient(var(--calendar-range-bg, var(--sys-color-primary-container)), var(--calendar-range-bg, var(--sys-color-primary-container)));
     background-repeat: no-repeat;
     background-size: 0 100%;
   }
-  ._rangeCalendar_zywoe_547 ._grid_zywoe_464 td:has(> ._day_zywoe_484[data-selected]) {
+  ._rangeCalendar_1t1xp_618 ._grid_1t1xp_535 td:has(> ._day_1t1xp_555[data-selected]) {
     background-size: 100% 100%;
   }
-  ._rangeCalendar_zywoe_547 ._grid_zywoe_464 td:has(> ._day_zywoe_484[data-selection-start]) {
+  ._rangeCalendar_1t1xp_618 ._grid_1t1xp_535 td:has(> ._day_1t1xp_555[data-selection-start]) {
     background-position-x: right;
     background-size: 50% 100%;
   }
-  ._rangeCalendar_zywoe_547 ._grid_zywoe_464 td:has(> ._day_zywoe_484[data-selection-end]) {
+  ._rangeCalendar_1t1xp_618 ._grid_1t1xp_535 td:has(> ._day_1t1xp_555[data-selection-end]) {
     background-position-x: left;
     background-size: 50% 100%;
   }
-  ._rangeCalendar_zywoe_547 ._grid_zywoe_464 td:has(> ._day_zywoe_484[data-selection-start][data-selection-end]) {
+  ._rangeCalendar_1t1xp_618 ._grid_1t1xp_535 td:has(> ._day_1t1xp_555[data-selection-start][data-selection-end]) {
     background-size: 0 100%;
   }
 }