@ionic/core 9.0.11-dev.11793728481.1fc40367 → 9.0.11-dev.11793792571.1765ff65

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.
Files changed (71) hide show
  1. package/components/ion-badge.js +1 -1
  2. package/components/ion-button.js +1 -1
  3. package/components/ion-content.js +1 -1
  4. package/components/ion-datetime-button.js +1 -1
  5. package/components/ion-datetime.js +1 -1
  6. package/components/ion-input-password-toggle.js +1 -1
  7. package/components/ion-item-option.js +1 -1
  8. package/components/ion-select-modal.js +1 -1
  9. package/components/ion-select.js +1 -1
  10. package/components/{p-B7ExaLVL.js → p-BCQSEpww.js} +1 -1
  11. package/components/p-Da8LCPwo.js +4 -0
  12. package/components/p-DirxxGzo.js +4 -0
  13. package/components/{p-BCYVFy50.js → p-py1vB-7U.js} +1 -1
  14. package/css/ionic/bundle.ionic.css +1 -1
  15. package/css/ionic/bundle.ionic.css.map +1 -1
  16. package/css/ionic/core.ionic.css +1 -1
  17. package/css/ionic/core.ionic.css.map +1 -1
  18. package/dist/cjs/ion-app_8.cjs.entry.js +13 -5
  19. package/dist/cjs/ion-avatar_3.cjs.entry.js +1 -1
  20. package/dist/cjs/ion-button_2.cjs.entry.js +1 -1
  21. package/dist/cjs/ion-datetime-button.cjs.entry.js +6 -33
  22. package/dist/cjs/ion-datetime.cjs.entry.js +36 -353
  23. package/dist/cjs/ion-item-option_3.cjs.entry.js +1 -1
  24. package/dist/cjs/ionic.cjs.js +1 -1
  25. package/dist/cjs/loader.cjs.js +1 -1
  26. package/dist/collection/components/badge/badge.ionic.css +1 -1
  27. package/dist/collection/components/button/button.ionic.css +1 -1
  28. package/dist/collection/components/content/content.ionic.css +352 -0
  29. package/dist/collection/components/content/{content.css → content.ios.css} +65 -41
  30. package/dist/collection/components/content/content.js +9 -5
  31. package/dist/collection/components/content/content.md.css +347 -0
  32. package/dist/collection/components/datetime/datetime.ionic.css +5 -179
  33. package/dist/collection/components/datetime/datetime.ios.css +2 -134
  34. package/dist/collection/components/datetime/datetime.js +33 -406
  35. package/dist/collection/components/datetime/datetime.md.css +0 -120
  36. package/dist/collection/components/datetime/utils/state.js +1 -18
  37. package/dist/collection/components/datetime-button/datetime-button.js +6 -34
  38. package/dist/collection/components/item-option/item-option.ionic.css +1 -1
  39. package/dist/docs.json +127 -160
  40. package/dist/esm/{format-DUHrIiJq.js → format-NT7iHsbA.js} +1 -1
  41. package/dist/esm/ion-app_8.entry.js +13 -5
  42. package/dist/esm/ion-avatar_3.entry.js +1 -1
  43. package/dist/esm/ion-button_2.entry.js +1 -1
  44. package/dist/esm/ion-datetime-button.entry.js +7 -34
  45. package/dist/esm/ion-datetime.entry.js +37 -354
  46. package/dist/esm/ion-item-option_3.entry.js +1 -1
  47. package/dist/esm/ionic.js +1 -1
  48. package/dist/esm/loader.js +1 -1
  49. package/dist/html.html-data.json +0 -20
  50. package/dist/ionic/ionic.esm.js +1 -1
  51. package/dist/ionic/p-0743a26a.entry.js +4 -0
  52. package/dist/ionic/p-1d709b26.entry.js +4 -0
  53. package/dist/ionic/p-39e3be74.entry.js +4 -0
  54. package/dist/ionic/p-6e4ee264.entry.js +4 -0
  55. package/dist/ionic/{p-CaOPF8Xt.js → p-BtccSO5J.js} +1 -1
  56. package/dist/ionic/p-ad46d2fd.entry.js +4 -0
  57. package/dist/ionic/{p-8231e914.entry.js → p-b51eb274.entry.js} +1 -1
  58. package/dist/types/components/datetime/datetime-interface.d.ts +0 -4
  59. package/dist/types/components/datetime/datetime.d.ts +2 -71
  60. package/dist/types/components/datetime/utils/state.d.ts +2 -5
  61. package/dist/types/components.d.ts +0 -33
  62. package/hydrate/index.js +59 -403
  63. package/hydrate/index.mjs +59 -403
  64. package/package.json +1 -1
  65. package/components/p-ByE0slik.js +0 -4
  66. package/components/p-DktrWeJE.js +0 -4
  67. package/dist/ionic/p-41680415.entry.js +0 -4
  68. package/dist/ionic/p-56d77e95.entry.js +0 -4
  69. package/dist/ionic/p-a52cba2f.entry.js +0 -4
  70. package/dist/ionic/p-b30b468d.entry.js +0 -4
  71. package/dist/ionic/p-ceca04fb.entry.js +0 -4
@@ -607,7 +607,7 @@ const isDayDisabled = (refParts, minParts, maxParts, dayValues) => {
607
607
  * Given a locale, a date, the selected date(s), and today's date,
608
608
  * generate the state for a given calendar day button.
609
609
  */
610
- const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts, maxParts, dayValues, rangeParts) => {
610
+ const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts, maxParts, dayValues) => {
611
611
  /**
612
612
  * activeParts signals what day(s) are currently selected in the datetime.
613
613
  * If multiple="true", this will be an array, but the logic in this util
@@ -623,20 +623,6 @@ const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts
623
623
  const isActive = activePartsArray.find((parts) => format.isSameDay(refParts, parts)) !== undefined;
624
624
  const isToday = format.isSameDay(refParts, todayParts);
625
625
  const disabled = isDayDisabled(refParts, minParts, maxParts, dayValues);
626
- /**
627
- * Range state: determine if this day is the range start, end, or in between.
628
- */
629
- let isRangeStart = false;
630
- let isRangeEnd = false;
631
- let isInRange = false;
632
- if (rangeParts) {
633
- const { start, end } = rangeParts;
634
- isRangeStart = format.isSameDay(refParts, start);
635
- if (end) {
636
- isRangeEnd = format.isSameDay(refParts, end);
637
- isInRange = !disabled && !isRangeStart && !isRangeEnd && format.isAfter(refParts, start) && format.isBefore(refParts, end);
638
- }
639
- }
640
626
  /**
641
627
  * Note that we always return one object regardless of whether activeParts
642
628
  * was an array, since we pare down to one value for isActive.
@@ -645,9 +631,6 @@ const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts
645
631
  disabled,
646
632
  isActive,
647
633
  isToday,
648
- isRangeStart,
649
- isRangeEnd,
650
- isInRange,
651
634
  ariaSelected: isActive ? 'true' : null,
652
635
  ariaLabel: format.generateDayAriaLabel(locale, isToday, refParts),
653
636
  text: refParts.day != null ? format.getDay(locale, refParts) : null,
@@ -770,11 +753,11 @@ const checkForPresentationFormatMismatch = (el, presentation, formatOptions) =>
770
753
  }
771
754
  };
772
755
 
773
- const datetimeIonicCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons,::slotted([slot=buttons]),.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible;z-index:0}:host .calendar-day-wrapper-in-range::before,:host .calendar-day-wrapper-range-start::before,:host .calendar-day-wrapper-range-end::before{position:absolute;top:50%;inset-inline-start:0;inset-inline-end:0;height:var(--range-track-height);-webkit-transform:translateY(-50%);transform:translateY(-50%);background:-webkit-gradient(linear, left top, left bottom, from(var(--range-background)), to(var(--range-background))), -webkit-gradient(linear, left top, left bottom, from(var(--background)), to(var(--background)));background:linear-gradient(var(--range-background), var(--range-background)), linear-gradient(var(--background), var(--background));content:"";z-index:-1}:host .calendar-day-wrapper-range-start::before{inset-inline-start:50%}:host .calendar-day-wrapper-range-end::before{inset-inline-end:50%}:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before{inset-inline-end:-1px}:host .calendar-day-wrapper-in-range:nth-child(7n)::before,:host .calendar-day-wrapper-range-start:nth-child(7n)::before{inset-inline-end:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-in-range:nth-child(7n+1)::before,:host .calendar-day-wrapper-range-end:nth-child(7n+1)::before{inset-inline-start:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-range-start.calendar-day-wrapper-range-end::before{display:none}:host(.datetime-disabled.datetime-range) .calendar-month-grid{opacity:0.4}:host(.datetime-disabled.datetime-range) .calendar-month-grid .calendar-day[disabled]{opacity:1}.calendar-day{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{--background:var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));--focus-ring-color:var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));--focus-ring-width:var(--token-border-size-050, var(--token-scale-050, 2px));--body-opacity:0;--year-opacity:0}:host .calendar-body{opacity:var(--body-opacity)}:host .datetime-year{opacity:var(--year-opacity)}:host(.datetime-ready) .calendar-body{--body-opacity:1}:host(.datetime-ready) .datetime-year{--year-opacity:1}:host .datetime-header{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-400, var(--token-scale-400, 16px));display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start;-ms-flex-pack:justify;justify-content:space-between;height:var(--token-scale-1400, 56px);margin-bottom:var(--token-space-200, var(--token-scale-200, 8px));border-bottom:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df)}:host .datetime-header .datetime-title{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-450, 1.125rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.555556;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-header .datetime-selected-date{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-regular, 400);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;color:var(--token-primitives-neutral-1000, #383e45)}.calendar-action-buttons{padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));-ms-flex-align:center;align-items:center;height:var(--token-scale-1400, 56px);-webkit-box-sizing:border-box;box-sizing:border-box}.calendar-month-year{-ms-flex:1 0 0px;flex:1 0 0}.calendar-month-year-toggle{border-radius:var(--token-border-radius-full, 999px);font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);min-height:var(--token-scale-1000, 40px);border:var(--focus-ring-width) solid transparent;color:var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}@media (any-hover: hover){.calendar-month-year-toggle:hover{background:var(--token-primitives-neutral-200, #ebeef2)}}.calendar-month-year-toggle.ion-focused{border-color:var(--focus-ring-color)}.calendar-month-year-toggle.ion-activated{background:var(--token-primitives-neutral-200, #ebeef2)}.calendar-next-prev ion-button.button-has-icon-only{--color:var(--token-primitives-neutral-1000, #383e45);--background-activated:var(--token-primitives-neutral-200, #ebeef2);--background-hover:var(--token-primitives-neutral-200, #ebeef2);--background-hover-opacity:1;min-height:var(--token-scale-1000, 40px)}.calendar-next-prev ion-button.button-has-icon-only.ion-focused::part(native){border:var(--token-border-size-050, var(--token-scale-050, 2px)) solid var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));outline:none}.calendar-days-of-week{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-300, 0.75rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-150, 0.015em);line-height:1.666667;text-transform:uppercase;-ms-flex-line-pack:center;align-content:center;height:var(--token-scale-1200, 48px);color:var(--token-primitives-neutral-800, #6c727a)}.calendar-day{border-radius:var(--token-border-radius-full, 999px);-webkit-padding-start:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-padding-end:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-end:var(--token-space-100, var(--token-scale-100, 4px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571;width:var(--token-scale-1200, 48px);min-width:var(--token-scale-1200, 48px);height:var(--token-scale-1200, 48px);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}.calendar-day[disabled]:not(.calendar-day-constrained){color:var(--token-text-disabled, var(--token-primitives-neutral-500, #9fa5ad))}.calendar-day.calendar-day-today{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active.calendar-day-adjacent-day{background:var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff)))}.calendar-day:focus-visible{border:var(--focus-ring-width) solid var(--focus-ring-color)}@media (any-hover: hover){.calendar-day:not([disabled]):not(:active):not(.calendar-day-in-range):hover{background:var(--token-semantics-primary-200, var(--token-primitives-blue-200, #e4e8ff))}}.calendar-day:active,.calendar-day.calendar-day-adjacent-day:active{background:var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa)))}.calendar-day.calendar-day-adjacent-day{color:var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a))}.calendar-day.calendar-day-active.calendar-day-adjacent-day{color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host{--range-background:var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff)));--range-track-height:var(--token-scale-1200, 48px)}:host .calendar-day.calendar-day-range-start,:host .calendar-day.calendar-day-range-end{border-radius:var(--token-border-radius-full, 999px);background:var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef))));color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}.calendar-day.calendar-day-in-range{border-radius:0;background:none;color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}.calendar-day.calendar-day-today.calendar-day-in-range{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}:host .calendar-day.calendar-day-today.calendar-day-range-start,:host .calendar-day.calendar-day-today.calendar-day-range-end{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}@media (any-hover: hover){.calendar-day.calendar-day-range-start:not([disabled]):not(:active):hover,.calendar-day.calendar-day-range-end:not([disabled]):not(:active):hover{background:var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)))}}.calendar-day.calendar-day-range-start:active,.calendar-day.calendar-day-range-end:active{background:var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)))}.calendar-day.calendar-day-in-range:active{background:var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa)))}:host(.datetime-disabled.datetime-range) .calendar-day[disabled]:not(.calendar-day-constrained){color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-adjacent-day[disabled]{color:var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a))}:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-today[disabled]{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-range-start[disabled],:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-range-end[disabled]{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}:host(.datetime-readonly) .calendar-day.calendar-day-range-start[disabled],:host(.datetime-readonly) .calendar-day.calendar-day-range-end[disabled]{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}:host(.datetime-readonly) .calendar-day.calendar-day-in-range[disabled]{color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host(.datetime-readonly) .calendar-day.calendar-day-today.calendar-day-in-range[disabled]{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}:host(.datetime-readonly) .calendar-day.calendar-day-today.calendar-day-range-start[disabled],:host(.datetime-readonly) .calendar-day.calendar-day-today.calendar-day-range-end[disabled]{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}:host .datetime-time{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host .datetime-time .time-header{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-time button{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-0, var(--token-scale-0, 0px));padding-bottom:var(--token-space-0, var(--token-scale-0, 0px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;border-radius:var(--token-border-radius-full, 999px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:var(--token-scale-800, 32px);background-color:var(--token-primitives-neutral-100, #f6f7fa);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host .datetime-footer{padding-left:0;padding-right:0;padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:0;margin-left:0;margin-right:0;margin-top:var(--token-space-200, var(--token-scale-200, 8px));margin-bottom:0;border-left:0;border-right:0;border-top:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df);border-bottom:0}:host .datetime-buttons .datetime-action-buttons,.datetime-action-buttons .datetime-action-buttons-container,::slotted([slot=buttons]){-ms-flex-flow:column;flex-flow:column;-ms-flex-align:stretch;align-items:stretch;gap:var(--token-space-200, var(--token-scale-200, 8px))}`;
756
+ const datetimeIonicCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons,::slotted([slot=buttons]),.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible}.calendar-day{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{--background:var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));--focus-ring-color:var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));--focus-ring-width:var(--token-border-radius-025, var(--token-scale-050, 2px));--body-opacity:0;--year-opacity:0}:host .calendar-body{opacity:var(--body-opacity)}:host .datetime-year{opacity:var(--year-opacity)}:host(.datetime-ready) .calendar-body{--body-opacity:1}:host(.datetime-ready) .datetime-year{--year-opacity:1}:host .datetime-header{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-400, var(--token-scale-400, 16px));display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start;-ms-flex-pack:justify;justify-content:space-between;height:var(--token-scale-1400, 56px);margin-bottom:var(--token-space-200, var(--token-scale-200, 8px));border-bottom:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df)}:host .datetime-header .datetime-title{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-450, 1.125rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.555556;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-header .datetime-selected-date{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-regular, 400);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;color:var(--token-primitives-neutral-1000, #383e45)}.calendar-action-buttons{padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));-ms-flex-align:center;align-items:center;height:var(--token-scale-1400, 56px);-webkit-box-sizing:border-box;box-sizing:border-box}.calendar-month-year{-ms-flex:1 0 0px;flex:1 0 0}.calendar-month-year-toggle{border-radius:var(--token-border-radius-full, 999px);font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);min-height:var(--token-scale-1000, 40px);border:var(--focus-ring-width) solid transparent;color:var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}@media (any-hover: hover){.calendar-month-year-toggle:hover{background:var(--token-primitives-neutral-200, #ebeef2)}}.calendar-month-year-toggle.ion-focused{border-color:var(--focus-ring-color)}.calendar-month-year-toggle.ion-activated{background:var(--token-primitives-neutral-200, #ebeef2)}.calendar-next-prev ion-button.button-has-icon-only{--color:var(--token-primitives-neutral-1000, #383e45);--background-activated:var(--token-primitives-neutral-200, #ebeef2);--background-hover:var(--token-primitives-neutral-200, #ebeef2);--background-hover-opacity:1;min-height:var(--token-scale-1000, 40px)}.calendar-next-prev ion-button.button-has-icon-only.ion-focused::part(native){border:var(--token-border-size-050, var(--token-scale-050, 2px)) solid var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));outline:none}.calendar-days-of-week{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-300, 0.75rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-150, 0.015em);line-height:1.666667;text-transform:uppercase;-ms-flex-line-pack:center;align-content:center;height:var(--token-scale-1200, 48px);color:var(--token-primitives-neutral-800, #6c727a)}.calendar-day{border-radius:var(--token-border-radius-full, 999px);-webkit-padding-start:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-padding-end:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-end:var(--token-space-100, var(--token-scale-100, 4px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571;width:var(--token-scale-1200, 48px);min-width:var(--token-scale-1200, 48px);height:var(--token-scale-1200, 48px);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}.calendar-day[disabled]:not(.calendar-day-constrained){color:var(--token-primitives-neutral-500, #9fa5ad)}.calendar-day.calendar-day-today{color:var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active.calendar-day-adjacent-day{background:var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff))}.calendar-day:focus-visible{border:var(--focus-ring-width) solid var(--focus-ring-color)}@media (any-hover: hover){.calendar-day:not([disabled]):not(:active):hover{background:var(--token-semantics-primary-200, var(--token-primitives-blue-200, #e4e8ff))}}.calendar-day:active,.calendar-day.calendar-day-adjacent-day:active{background:var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa)))}.calendar-day.calendar-day-adjacent-day{color:var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a))}.calendar-day.calendar-day-active.calendar-day-adjacent-day{color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host .datetime-time{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host .datetime-time .time-header{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-time button{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-0, var(--token-scale-0, 0px));padding-bottom:var(--token-space-0, var(--token-scale-0, 0px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;border-radius:var(--token-border-radius-full, 999px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:var(--token-scale-800, 32px);background-color:var(--token-primitives-neutral-100, #f6f7fa);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host .datetime-footer{padding-left:0;padding-right:0;padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:0;margin-left:0;margin-right:0;margin-top:var(--token-space-200, var(--token-scale-200, 8px));margin-bottom:0;border-left:0;border-right:0;border-top:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df);border-bottom:0}:host .datetime-buttons .datetime-action-buttons,.datetime-action-buttons .datetime-action-buttons-container,::slotted([slot=buttons]){-ms-flex-flow:column;flex-flow:column;-ms-flex-align:stretch;align-items:stretch;gap:var(--token-space-200, var(--token-scale-200, 8px))}`;
774
757
 
775
- const datetimeIosCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons,::slotted([slot=buttons]),.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible;z-index:0}:host .calendar-day-wrapper-in-range::before,:host .calendar-day-wrapper-range-start::before,:host .calendar-day-wrapper-range-end::before{position:absolute;top:50%;inset-inline-start:0;inset-inline-end:0;height:var(--range-track-height);-webkit-transform:translateY(-50%);transform:translateY(-50%);background:-webkit-gradient(linear, left top, left bottom, from(var(--range-background)), to(var(--range-background))), -webkit-gradient(linear, left top, left bottom, from(var(--background)), to(var(--background)));background:linear-gradient(var(--range-background), var(--range-background)), linear-gradient(var(--background), var(--background));content:"";z-index:-1}:host .calendar-day-wrapper-range-start::before{inset-inline-start:50%}:host .calendar-day-wrapper-range-end::before{inset-inline-end:50%}:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before{inset-inline-end:-1px}:host .calendar-day-wrapper-in-range:nth-child(7n)::before,:host .calendar-day-wrapper-range-start:nth-child(7n)::before{inset-inline-end:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-in-range:nth-child(7n+1)::before,:host .calendar-day-wrapper-range-end:nth-child(7n+1)::before{inset-inline-start:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-range-start.calendar-day-wrapper-range-end::before{display:none}:host(.datetime-disabled.datetime-range) .calendar-month-grid{opacity:0.4}:host(.datetime-disabled.datetime-range) .calendar-month-grid .calendar-day[disabled]{opacity:1}.calendar-day{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}:host(.datetime-size-fixed.datetime-prefer-wheel){min-width:350px;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}:host .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-base-rgb), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host(.datetime-presentation-time) .datetime-time{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host ion-popover{--height:200px}:host .time-body{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-light, #f4f5f8);--background-rgb:var(--ion-color-light-rgb, 244, 245, 248);--title-color:var(--ion-color-step-600, var(--ion-text-color-step-400, #666666))}:host(.datetime-presentation-date-time:not(.datetime-prefer-wheel)),:host(.datetime-presentation-time-date:not(.datetime-prefer-wheel)),:host(.datetime-presentation-date:not(.datetime-prefer-wheel)){min-height:350px}:host .datetime-header{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:16px;padding-bottom:16px;border-bottom:0.55px solid var(--ion-color-step-200, var(--ion-background-color-step-200, #cccccc));font-size:min(0.875rem, 22.4px)}:host .datetime-header .datetime-title{color:var(--title-color)}:host .datetime-header .datetime-selected-date{margin-top:10px}.calendar-month-year-toggle{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0px;padding-bottom:0px;min-height:44px;font-size:min(1rem, 25.6px);font-weight:600}.calendar-month-year-toggle.ion-focused::after{opacity:0.15}.calendar-month-year-toggle #toggle-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:10px;margin-bottom:10px}:host .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host .calendar-action-buttons ion-button{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host(.ion-color) .calendar-action-buttons ion-button{color:var(--ion-color-base)}:host .calendar-action-buttons ion-button{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host .calendar-action-buttons .calendar-next-prev{-ms-flex-align:stretch;align-items:stretch}.calendar-next-prev ion-button{--padding-top:0;--padding-bottom:0;--padding-start:5px;--padding-end:5px;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;min-height:32px}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.65em;line-height:0.67}:host .calendar-days-of-week{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:0;padding-bottom:0;color:var(--ion-color-step-300, var(--ion-text-color-step-700, #b3b3b3));font-size:min(0.75rem, 19.2px);font-weight:600;line-height:24px;text-transform:uppercase}@supports (border-radius: mod(1px, 1px)){.calendar-days-of-week .day-of-week{width:clamp(20px, calc(mod(min(1rem, 24px), 24px) * 10), 100%);height:24px;overflow:hidden}.calendar-day{border-radius:max(8px, mod(min(1rem, 24px), 24px) * 10)}}@supports ((border-radius: mod(1px, 1px)) and (background: -webkit-named-image(apple-pay-logo-black)) and (not (contain-intrinsic-size: none))) or (not (border-radius: mod(1px, 1px))){.calendar-days-of-week .day-of-week{width:auto;height:auto;overflow:initial}.calendar-day{border-radius:32px}}:host .calendar-body .calendar-month .calendar-month-grid{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;-ms-flex-align:center;align-items:center;height:calc(100% - 16px)}:host .calendar-day-wrapper{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;height:0;min-height:1rem}:host .calendar-day{width:40px;min-width:40px;height:40px;font-size:min(1.25rem, 32px)}.calendar-day.calendar-day-active{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.12);font-size:min(1.375rem, 35.2px)}:host(.ion-color) .calendar-day.calendar-day-active{background:rgba(var(--ion-color-base-rgb), 0.12)}:host .calendar-day.calendar-day-today{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary, #0054e9);font-weight:600}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-base)}:host .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-300, var(--ion-text-color-step-700, #b3b3b3))}:host{--range-background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.12);--range-track-height:40px;--range-track-edge-overflow:8px}:host(.ion-color){--range-background:rgba(var(--ion-color-base-rgb), 0.12)}:host(.datetime-range) .calendar-day-wrapper{height:auto}:host .calendar-day.calendar-day-range-start,:host .calendar-day.calendar-day-range-end{border-radius:50%;background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff);font-weight:600}:host(.ion-color) .calendar-day.calendar-day-range-start,:host(.ion-color) .calendar-day.calendar-day-range-end{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host .datetime-time{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:16px;font-size:min(1rem, 25.6px)}:host .datetime-time .time-header{font-weight:600}:host .datetime-buttons{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;border-top:0.55px solid var(--ion-color-step-200, var(--ion-background-color-step-200, #cccccc))}:host .datetime-buttons,::slotted([slot=buttons]){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}:host .datetime-action-buttons,::slotted([slot=buttons]){width:100%}`;
758
+ const datetimeIosCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons,::slotted([slot=buttons]),.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible}.calendar-day{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}:host(.datetime-size-fixed.datetime-prefer-wheel){min-width:350px;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}:host .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-base-rgb), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host(.datetime-presentation-time) .datetime-time{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host ion-popover{--height:200px}:host .time-body{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-light, #f4f5f8);--background-rgb:var(--ion-color-light-rgb, 244, 245, 248);--title-color:var(--ion-color-step-600, var(--ion-text-color-step-400, #666666))}:host(.datetime-presentation-date-time:not(.datetime-prefer-wheel)),:host(.datetime-presentation-time-date:not(.datetime-prefer-wheel)),:host(.datetime-presentation-date:not(.datetime-prefer-wheel)){min-height:350px}:host .datetime-header{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:16px;padding-bottom:16px;border-bottom:0.55px solid var(--ion-color-step-200, var(--ion-background-color-step-200, #cccccc));font-size:min(0.875rem, 22.4px)}:host .datetime-header .datetime-title{color:var(--title-color)}:host .datetime-header .datetime-selected-date{margin-top:10px}.calendar-month-year-toggle{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0px;padding-bottom:0px;min-height:44px;font-size:min(1rem, 25.6px);font-weight:600}.calendar-month-year-toggle.ion-focused::after{opacity:0.15}.calendar-month-year-toggle #toggle-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:10px;margin-bottom:10px}:host .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host .calendar-action-buttons ion-button{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host(.ion-color) .calendar-action-buttons ion-button{color:var(--ion-color-base)}:host .calendar-action-buttons ion-button{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host .calendar-action-buttons .calendar-next-prev{-ms-flex-align:stretch;align-items:stretch}.calendar-next-prev ion-button{--padding-top:0;--padding-bottom:0;--padding-start:5px;--padding-end:5px;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;min-height:32px}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.65em;line-height:0.67}:host .calendar-days-of-week{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:0;padding-bottom:0;color:var(--ion-color-step-300, var(--ion-text-color-step-700, #b3b3b3));font-size:min(0.75rem, 19.2px);font-weight:600;line-height:24px;text-transform:uppercase}@supports (border-radius: mod(1px, 1px)){.calendar-days-of-week .day-of-week{width:clamp(20px, calc(mod(min(1rem, 24px), 24px) * 10), 100%);height:24px;overflow:hidden}.calendar-day{border-radius:max(8px, mod(min(1rem, 24px), 24px) * 10)}}@supports ((border-radius: mod(1px, 1px)) and (background: -webkit-named-image(apple-pay-logo-black)) and (not (contain-intrinsic-size: none))) or (not (border-radius: mod(1px, 1px))){.calendar-days-of-week .day-of-week{width:auto;height:auto;overflow:initial}.calendar-day{border-radius:32px}}:host .calendar-body .calendar-month .calendar-month-grid{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;-ms-flex-align:center;align-items:center;height:calc(100% - 16px)}:host .calendar-day-wrapper{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;height:0;min-height:1rem}:host .calendar-day{width:40px;min-width:40px;height:40px;font-size:min(1.25rem, 32px)}.calendar-day.calendar-day-active{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);font-size:min(1.375rem, 35.2px)}:host(.ion-color) .calendar-day.calendar-day-active{background:rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-day.calendar-day-today{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary, #0054e9);font-weight:600}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-base)}:host .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-300, var(--ion-text-color-step-700, #b3b3b3))}:host .datetime-time{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:16px;font-size:min(1rem, 25.6px)}:host .datetime-time .time-header{font-weight:600}:host .datetime-buttons{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;border-top:0.55px solid var(--ion-color-step-200, var(--ion-background-color-step-200, #cccccc))}:host .datetime-buttons,::slotted([slot=buttons]){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}:host .datetime-action-buttons,::slotted([slot=buttons]){width:100%}`;
776
759
 
777
- const datetimeMdCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons,::slotted([slot=buttons]),.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible;z-index:0}:host .calendar-day-wrapper-in-range::before,:host .calendar-day-wrapper-range-start::before,:host .calendar-day-wrapper-range-end::before{position:absolute;top:50%;inset-inline-start:0;inset-inline-end:0;height:var(--range-track-height);-webkit-transform:translateY(-50%);transform:translateY(-50%);background:-webkit-gradient(linear, left top, left bottom, from(var(--range-background)), to(var(--range-background))), -webkit-gradient(linear, left top, left bottom, from(var(--background)), to(var(--background)));background:linear-gradient(var(--range-background), var(--range-background)), linear-gradient(var(--background), var(--background));content:"";z-index:-1}:host .calendar-day-wrapper-range-start::before{inset-inline-start:50%}:host .calendar-day-wrapper-range-end::before{inset-inline-end:50%}:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before{inset-inline-end:-1px}:host .calendar-day-wrapper-in-range:nth-child(7n)::before,:host .calendar-day-wrapper-range-start:nth-child(7n)::before{inset-inline-end:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-in-range:nth-child(7n+1)::before,:host .calendar-day-wrapper-range-end:nth-child(7n+1)::before{inset-inline-start:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-range-start.calendar-day-wrapper-range-end::before{display:none}:host(.datetime-disabled.datetime-range) .calendar-month-grid{opacity:0.4}:host(.datetime-disabled.datetime-range) .calendar-month-grid .calendar-day[disabled]{opacity:1}.calendar-day{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}:host(.datetime-size-fixed.datetime-prefer-wheel){min-width:350px;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}:host .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-base-rgb), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host(.datetime-presentation-time) .datetime-time{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host ion-popover{--height:200px}:host .time-body{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #ffffff));--title-color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color){--title-color:var(--ion-color-contrast)}:host .datetime-header{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px;padding-top:20px;padding-bottom:20px;background:var(--ion-color-primary, #0054e9);color:var(--title-color)}:host(.ion-color) .datetime-header{background:var(--ion-color-base)}:host .datetime-header .datetime-title{font-size:0.75rem;text-transform:uppercase}:host .datetime-header .datetime-selected-date{margin-top:30px;font-size:2.125rem}:host .calendar-action-buttons ion-button{--color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959))}.calendar-next-prev ion-button{--padding-top:12px;--padding-end:12px;--padding-bottom:12px;--padding-start:12px;--border-radius:50%;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:3rem;height:3rem}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.8em}.calendar-month-year-toggle{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:12px;padding-bottom:12px;min-height:48px;background:transparent;color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959));z-index:1}.calendar-month-year-toggle.ion-focused::after{opacity:0.04}.calendar-month-year-toggle ion-ripple-effect{color:currentColor}@media (any-hover: hover){.calendar-month-year-toggle.ion-activatable:not(.ion-focused):hover::after{background:currentColor;opacity:0.04}}:host .calendar-days-of-week{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:0px;padding-bottom:0px;color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray));font-size:0.875rem;line-height:36px}:host .calendar-body .calendar-month .calendar-month-grid{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:4px;padding-bottom:4px;grid-template-rows:repeat(6, 1fr)}:host .calendar-day{width:42px;min-width:42px;height:42px;font-size:0.875rem}:host .calendar-day.calendar-day-today{border:1px solid var(--ion-color-primary, #0054e9);color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{border:1px solid var(--ion-color-base);color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-contrast)}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-primary, #0054e9);background:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-base);background:var(--ion-color-base)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}:host{--range-background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.12);--range-track-height:42px;--range-track-edge-overflow:10px}:host(.ion-color){--range-background:rgba(var(--ion-color-base-rgb), 0.12)}:host .calendar-day.calendar-day-range-start,:host .calendar-day.calendar-day-range-end{border-radius:50%;background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-range-start,:host(.ion-color) .calendar-day.calendar-day-range-end{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host .datetime-time{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:8px}:host .time-header{color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959))}:host(.datetime-presentation-month) .datetime-year,:host(.datetime-presentation-year) .datetime-year,:host(.datetime-presentation-month-year) .datetime-year{margin-top:20px;margin-bottom:20px}:host .datetime-buttons{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:10px;padding-bottom:10px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}`;
760
+ const datetimeMdCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons,::slotted([slot=buttons]),.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible}.calendar-day{-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}:host(.datetime-size-fixed.datetime-prefer-wheel){min-width:350px;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}:host .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-base-rgb), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host(.datetime-presentation-time) .datetime-time{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host ion-popover{--height:200px}:host .time-body{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #ffffff));--title-color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color){--title-color:var(--ion-color-contrast)}:host .datetime-header{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px;padding-top:20px;padding-bottom:20px;background:var(--ion-color-primary, #0054e9);color:var(--title-color)}:host(.ion-color) .datetime-header{background:var(--ion-color-base)}:host .datetime-header .datetime-title{font-size:0.75rem;text-transform:uppercase}:host .datetime-header .datetime-selected-date{margin-top:30px;font-size:2.125rem}:host .calendar-action-buttons ion-button{--color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959))}.calendar-next-prev ion-button{--padding-top:12px;--padding-end:12px;--padding-bottom:12px;--padding-start:12px;--border-radius:50%;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:3rem;height:3rem}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.8em}.calendar-month-year-toggle{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:12px;padding-bottom:12px;min-height:48px;background:transparent;color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959));z-index:1}.calendar-month-year-toggle.ion-focused::after{opacity:0.04}.calendar-month-year-toggle ion-ripple-effect{color:currentColor}@media (any-hover: hover){.calendar-month-year-toggle.ion-activatable:not(.ion-focused):hover::after{background:currentColor;opacity:0.04}}:host .calendar-days-of-week{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:0px;padding-bottom:0px;color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray));font-size:0.875rem;line-height:36px}:host .calendar-body .calendar-month .calendar-month-grid{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:4px;padding-bottom:4px;grid-template-rows:repeat(6, 1fr)}:host .calendar-day{width:42px;min-width:42px;height:42px;font-size:0.875rem}:host .calendar-day.calendar-day-today{border:1px solid var(--ion-color-primary, #0054e9);color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{border:1px solid var(--ion-color-base);color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-contrast)}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-primary, #0054e9);background:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-base);background:var(--ion-color-base)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}:host .datetime-time{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:8px}:host .time-header{color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959))}:host(.datetime-presentation-month) .datetime-year,:host(.datetime-presentation-year) .datetime-year,:host(.datetime-presentation-month-year) .datetime-year{margin-top:20px;margin-bottom:20px}:host .datetime-buttons{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:10px;padding-bottom:10px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}`;
778
761
 
779
762
  const Datetime = class {
780
763
  constructor(hostRef) {
@@ -787,11 +770,6 @@ const Datetime = class {
787
770
  this.ionStyle = index.createEvent(this, "ionStyle", 7);
788
771
  this.ionRender = index.createEvent(this, "ionRender", 7);
789
772
  this.inputId = `ion-dt-${datetimeIds++}`;
790
- /**
791
- * Set when the user completes a range interactively, so processValue
792
- * can skip navigation and keep the calendar on the current month.
793
- */
794
- this.rangeCompletedInteractively = false;
795
773
  /**
796
774
  * Set when the user selects a value, cleared when it's confirmed
797
775
  * or `processValue` runs (`reset()`, or `value` being set to a
@@ -865,22 +843,8 @@ const Datetime = class {
865
843
  /**
866
844
  * If `true`, multiple dates can be selected at once. Only
867
845
  * applies to `presentation="date"` and `preferWheel="false"`.
868
- *
869
- * @deprecated Use `selectionMode="multiple"` instead.
870
846
  */
871
847
  this.multiple = false;
872
- /**
873
- * The text shown in the datetime header when the start of the range
874
- * is empty, also used by screen readers to announce the start date.
875
- * Only applies when `selectionMode="range"`.
876
- */
877
- this.startDateLabel = 'Start date';
878
- /**
879
- * The text shown in the datetime header when the end of the range
880
- * is empty, also used by screen readers to announce the end date.
881
- * Only applies when `selectionMode="range"`.
882
- */
883
- this.endDateLabel = 'End date';
884
848
  /**
885
849
  * If `true`, a header will be shown above the calendar
886
850
  * picker. This will include both the slotted title, and
@@ -933,8 +897,8 @@ const Datetime = class {
933
897
  */
934
898
  this.preferWheel = false;
935
899
  this.warnIfIncorrectValueUsage = () => {
936
- const { value } = this;
937
- if (!this.isMultipleMode && !this.isRangeMode && Array.isArray(value)) {
900
+ const { multiple, value } = this;
901
+ if (!multiple && Array.isArray(value)) {
938
902
  /**
939
903
  * We do some processing on the `value` array so
940
904
  * that it looks more like an array when logged to
@@ -943,13 +907,7 @@ const Datetime = class {
943
907
  * Default toString() behavior: a,b
944
908
  * Custom behavior: ['a', 'b']
945
909
  */
946
- index.printIonWarning(`[ion-datetime] - An array of values was passed, but neither selectionMode="multiple" nor selectionMode="range" is set. This is incorrect usage and may result in unexpected behaviors.
947
-
948
- Value Passed: [${value.map((v) => `'${v}'`).join(', ')}]
949
- `, this.el);
950
- }
951
- if (this.isRangeMode && Array.isArray(value) && value.length > 2) {
952
- index.printIonWarning(`[ion-datetime] - More than 2 values were passed with selectionMode="range". Only the first and last values will be used.
910
+ index.printIonWarning(`[ion-datetime] - An array of values was passed, but multiple is "false". This is incorrect usage and may result in unexpected behaviors. To dismiss this warning, pass a string to the "value" property when multiple="false".
953
911
 
954
912
  Value Passed: [${value.map((v) => `'${v}'`).join(', ')}]
955
913
  `, this.el);
@@ -975,9 +933,6 @@ const Datetime = class {
975
933
  };
976
934
  this.getActivePart = () => {
977
935
  const { activeParts } = this;
978
- if (this.isRangeParts(activeParts)) {
979
- return activeParts.start;
980
- }
981
936
  return Array.isArray(activeParts) ? activeParts[0] : activeParts;
982
937
  };
983
938
  this.closeParentOverlay = (role) => {
@@ -992,33 +947,6 @@ const Datetime = class {
992
947
  ...parts,
993
948
  };
994
949
  };
995
- /**
996
- * Checks whether the span from start to end contains any disabled day.
997
- * Used by range mode to prevent selecting across disabled dates.
998
- */
999
- this.rangeContainsDisabledDate = (start, end) => {
1000
- const { minParts, maxParts, parsedDayValues, parsedMonthValues, parsedYearValues, isDateEnabled } = this;
1001
- let cursor = format.getNextDay(start);
1002
- while (format.isBefore(cursor, end)) {
1003
- if (isDayDisabled(cursor, minParts, maxParts, parsedDayValues) ||
1004
- (parsedMonthValues !== undefined && !parsedMonthValues.includes(cursor.month)) ||
1005
- (parsedYearValues !== undefined && !parsedYearValues.includes(cursor.year))) {
1006
- return true;
1007
- }
1008
- if (isDateEnabled) {
1009
- try {
1010
- if (!isDateEnabled(format.convertDataToISO(cursor))) {
1011
- return true;
1012
- }
1013
- }
1014
- catch {
1015
- // Swallow user callback exceptions during validation
1016
- }
1017
- }
1018
- cursor = format.getNextDay(cursor);
1019
- }
1020
- return false;
1021
- };
1022
950
  this.setActiveParts = (parts, removeDate = false) => {
1023
951
  /** if the datetime component is in readonly mode,
1024
952
  * allow browsing of the calendar without changing
@@ -1028,7 +956,7 @@ const Datetime = class {
1028
956
  return;
1029
957
  }
1030
958
  this.hasUnconfirmedSelection = true;
1031
- const { minParts, maxParts, activeParts } = this;
959
+ const { multiple, minParts, maxParts, activeParts } = this;
1032
960
  /**
1033
961
  * When setting the active parts, it is possible
1034
962
  * to set invalid data. For example,
@@ -1041,10 +969,7 @@ const Datetime = class {
1041
969
  */
1042
970
  const validatedParts = format.validateParts(parts, minParts, maxParts);
1043
971
  this.setWorkingParts(validatedParts);
1044
- if (this.isRangeMode) {
1045
- this.setActivePartsRange(validatedParts);
1046
- }
1047
- else if (this.isMultipleMode) {
972
+ if (multiple) {
1048
973
  const activePartsArray = Array.isArray(activeParts) ? activeParts : [activeParts];
1049
974
  if (removeDate) {
1050
975
  this.activeParts = activePartsArray.filter((p) => !format.isSameDay(p, validatedParts));
@@ -1064,26 +989,6 @@ const Datetime = class {
1064
989
  }
1065
990
  this.confirm();
1066
991
  };
1067
- /**
1068
- * Handles range selection logic when a day is clicked.
1069
- *
1070
- * Creating a new range: first click sets start, second sets end.
1071
- * Modifying an existing range:
1072
- * - Before range → new start
1073
- * - Within range → new end
1074
- * - After range → new end
1075
- * If the resulting span contains a disabled date, start a new range instead.
1076
- */
1077
- this.setActivePartsRange = (parts) => {
1078
- const current = this.rangeParts;
1079
- if (!current || format.isBefore(parts, current.start) || this.rangeContainsDisabledDate(current.start, parts)) {
1080
- this.activeParts = { start: parts };
1081
- }
1082
- else {
1083
- this.rangeCompletedInteractively = true;
1084
- this.activeParts = { start: current.start, end: parts };
1085
- }
1086
- };
1087
992
  this.initializeKeyboardListeners = () => {
1088
993
  const calendarBodyRef = this.calendarBodyRef;
1089
994
  if (!calendarBodyRef) {
@@ -1495,59 +1400,6 @@ const Datetime = class {
1495
1400
  if (hasValue) {
1496
1401
  format.warnIfValueOutOfBounds(valueToProcess, minParts, maxParts);
1497
1402
  }
1498
- /**
1499
- * Range mode: convert the value array into DatetimeRangeParts.
1500
- */
1501
- if (this.isRangeMode) {
1502
- /**
1503
- * The calendar navigates to the start of the range, or to the default
1504
- * date when there is nothing selected, so that an empty range mode
1505
- * opens on the same month as the other selection modes.
1506
- */
1507
- let navigateTo;
1508
- if (hasValue && Array.isArray(valueToProcess)) {
1509
- let rangeValues = valueToProcess;
1510
- // If more than 2 entries, use first and last
1511
- if (rangeValues.length > 2) {
1512
- rangeValues = [rangeValues[0], rangeValues[rangeValues.length - 1]];
1513
- }
1514
- let startParts = rangeValues[0];
1515
- let endParts = rangeValues.length > 1 ? rangeValues[1] : undefined;
1516
- // Normalize reversed pairs so earlier date is start
1517
- if (endParts && format.isAfter(startParts, endParts)) {
1518
- const temp = startParts;
1519
- startParts = endParts;
1520
- endParts = temp;
1521
- }
1522
- this.activeParts = endParts ? { start: startParts, end: endParts } : { start: startParts };
1523
- /**
1524
- * When the user just completed the range interactively, stay on the
1525
- * current month instead of jumping back to the start. The flag is
1526
- * set in setActivePartsRange and consumed here.
1527
- */
1528
- if (endParts && this.rangeCompletedInteractively) {
1529
- this.rangeCompletedInteractively = false;
1530
- return;
1531
- }
1532
- navigateTo = startParts;
1533
- }
1534
- else {
1535
- this.activeParts = [];
1536
- navigateTo = Array.isArray(valueToProcess) ? valueToProcess[0] : valueToProcess;
1537
- }
1538
- const targetValue = format.clampDate(navigateTo, minParts, maxParts);
1539
- const { month, day, year } = targetValue;
1540
- const didChangeMonth = (month !== undefined && month !== workingParts.month) || (year !== undefined && year !== workingParts.year);
1541
- const bodyIsVisible = el.classList.contains('datetime-ready');
1542
- const { isGridStyle, showMonthAndYear } = this;
1543
- if (isGridStyle && didChangeMonth && bodyIsVisible && !showMonthAndYear) {
1544
- this.animateToDate(targetValue);
1545
- }
1546
- else {
1547
- this.setWorkingParts({ month, day, year, hour: 0, minute: 0, ampm: 'am' });
1548
- }
1549
- return;
1550
- }
1551
1403
  /**
1552
1404
  * If there are multiple values, clamp to the last one.
1553
1405
  * This is because the last value is the one that the user
@@ -1709,27 +1561,6 @@ const Datetime = class {
1709
1561
  const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
1710
1562
  return hasDatePresentation && !preferWheel;
1711
1563
  }
1712
- get isMultipleMode() {
1713
- return this.selectionMode === 'multiple' || (this.selectionMode === undefined && this.multiple);
1714
- }
1715
- get isRangeMode() {
1716
- return this.selectionMode === 'range';
1717
- }
1718
- /**
1719
- * Type guard: returns true if the given activeParts is a DatetimeRangeParts object.
1720
- */
1721
- isRangeParts(parts) {
1722
- return this.isRangeMode && parts !== null && typeof parts === 'object' && !Array.isArray(parts) && 'start' in parts;
1723
- }
1724
- /**
1725
- * Returns the current range parts if in range mode, or undefined otherwise.
1726
- */
1727
- get rangeParts() {
1728
- if (this.isRangeParts(this.activeParts)) {
1729
- return this.activeParts;
1730
- }
1731
- return undefined;
1732
- }
1733
1564
  yearValuesChanged() {
1734
1565
  this.parsedYearValues = format.convertToArrayOfNumbers(this.yearValues);
1735
1566
  }
@@ -1765,19 +1596,6 @@ const Datetime = class {
1765
1596
  */
1766
1597
  async confirm(closeOverlay = false) {
1767
1598
  const { isCalendarPicker, activeParts, preferWheel, workingParts } = this;
1768
- /**
1769
- * In range mode, only confirm when both start and end are selected.
1770
- */
1771
- if (this.isRangeMode) {
1772
- if (!this.isRangeParts(activeParts) || !activeParts.end) {
1773
- return;
1774
- }
1775
- this.setValue([format.convertDataToISO(activeParts.start), format.convertDataToISO(activeParts.end)]);
1776
- if (closeOverlay) {
1777
- this.closeParentOverlay(CONFIRM_ROLE);
1778
- }
1779
- return;
1780
- }
1781
1599
  /**
1782
1600
  * We only update the value if the presentation is not a calendar picker.
1783
1601
  */
@@ -1813,22 +1631,6 @@ const Datetime = class {
1813
1631
  * @param startDate A valid [ISO-8601 string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#date_time_string_format) to reset the datetime state to.
1814
1632
  */
1815
1633
  async reset(startDate) {
1816
- if (this.isRangeMode) {
1817
- /**
1818
- * In range mode, reset clears the full range. If a startDate
1819
- * is provided, the calendar navigates to that month without
1820
- * selecting anything so the user begins a fresh selection.
1821
- */
1822
- this.activeParts = [];
1823
- if (startDate) {
1824
- const parsed = format.parseDate(startDate);
1825
- if (parsed) {
1826
- const target = Array.isArray(parsed) ? parsed[0] : parsed;
1827
- this.setWorkingParts(target);
1828
- }
1829
- }
1830
- return;
1831
- }
1832
1634
  this.processValue(startDate);
1833
1635
  }
1834
1636
  /**
@@ -2064,11 +1866,8 @@ const Datetime = class {
2064
1866
  });
2065
1867
  }
2066
1868
  componentWillLoad() {
2067
- const { el, formatOptions, highlightedDates, multiple, selectionMode, presentation, preferWheel } = this;
2068
- if (selectionMode === undefined && multiple) {
2069
- index.printIonWarning('[ion-datetime] - The "multiple" property is deprecated. Use selectionMode="multiple" instead.', el);
2070
- }
2071
- if (this.isMultipleMode) {
1869
+ const { el, formatOptions, highlightedDates, multiple, presentation, preferWheel } = this;
1870
+ if (multiple) {
2072
1871
  if (presentation !== 'date') {
2073
1872
  index.printIonWarning('[ion-datetime] - Multiple date selection is only supported for presentation="date".', el);
2074
1873
  }
@@ -2076,17 +1875,6 @@ const Datetime = class {
2076
1875
  index.printIonWarning('[ion-datetime] - Multiple date selection is not supported with preferWheel="true".', el);
2077
1876
  }
2078
1877
  }
2079
- if (this.isRangeMode) {
2080
- if (presentation !== 'date') {
2081
- index.printIonWarning('[ion-datetime] - Range selection is only supported for presentation="date".', el);
2082
- }
2083
- if (preferWheel) {
2084
- index.printIonWarning('[ion-datetime] - Range selection is not supported with preferWheel="true".', el);
2085
- }
2086
- }
2087
- if (selectionMode !== undefined && multiple) {
2088
- index.printIonWarning('[ion-datetime] - Both "selectionMode" and "multiple" are set. "selectionMode" takes precedence.', el);
2089
- }
2090
1878
  if (highlightedDates !== undefined) {
2091
1879
  if (presentation !== 'date' && presentation !== 'date-time' && presentation !== 'time-date') {
2092
1880
  index.printIonWarning('[ion-datetime] - The highlightedDates property is only supported with the date, date-time, and time-date presentations.', el);
@@ -2141,12 +1929,6 @@ const Datetime = class {
2141
1929
  * is disabled or readonly.
2142
1930
  */
2143
1931
  const isButtonDisabled = disabled || readonly;
2144
- /**
2145
- * In range mode, the confirm button should be disabled until
2146
- * both a start and end date have been selected.
2147
- */
2148
- const isRangeIncomplete = this.isRangeMode && (!this.isRangeParts(this.activeParts) || !this.activeParts.end);
2149
- const isConfirmDisabled = isButtonDisabled || isRangeIncomplete;
2150
1932
  const confirmFill = theme === 'ionic' ? 'solid' : undefined;
2151
1933
  const hasSlottedButtons = this.el.querySelector('[slot="buttons"]') !== null;
2152
1934
  if (!hasSlottedButtons && !showDefaultButtons && !showClearButton) {
@@ -2166,7 +1948,7 @@ const Datetime = class {
2166
1948
  return (index.h("div", { class: "datetime-footer" }, index.h("div", { class: "datetime-buttons" }, index.h("div", { class: {
2167
1949
  ['datetime-action-buttons']: true,
2168
1950
  ['has-clear-button']: this.showClearButton,
2169
- } }, index.h("slot", { name: "buttons" }, showDefaultButtons && (index.h("ion-button", { id: "cancel-button", color: this.color, onClick: () => this.cancel(true), disabled: isButtonDisabled }, this.cancelText)), index.h("div", { class: "datetime-action-buttons-container" }, showClearButton && (index.h("ion-button", { id: "clear-button", color: this.color, onClick: () => clearButtonClick(), disabled: isButtonDisabled }, this.clearText)), showDefaultButtons && (index.h("ion-button", { id: "confirm-button", fill: confirmFill, color: this.color, onClick: () => this.confirm(true), disabled: isConfirmDisabled }, this.doneText))))))));
1951
+ } }, index.h("slot", { name: "buttons" }, showDefaultButtons && (index.h("ion-button", { id: "cancel-button", color: this.color, onClick: () => this.cancel(true), disabled: isButtonDisabled }, this.cancelText)), index.h("div", { class: "datetime-action-buttons-container" }, showClearButton && (index.h("ion-button", { id: "clear-button", color: this.color, onClick: () => clearButtonClick(), disabled: isButtonDisabled }, this.clearText)), showDefaultButtons && (index.h("ion-button", { id: "confirm-button", fill: confirmFill, color: this.color, onClick: () => this.confirm(true), disabled: isButtonDisabled }, this.doneText))))))));
2170
1952
  }
2171
1953
  /**
2172
1954
  * Wheel picker render methods
@@ -2355,8 +2137,8 @@ const Datetime = class {
2355
2137
  ...this.workingParts,
2356
2138
  month: ev.detail.value,
2357
2139
  });
2358
- // Month wheel is navigation-only in multi-select and range modes as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
2359
- if (!this.isMultipleMode && !this.isRangeMode) {
2140
+ // Month wheel is navigation-only in multi-select mode as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
2141
+ if (!this.multiple) {
2360
2142
  this.setActiveParts({
2361
2143
  ...activePart,
2362
2144
  month: ev.detail.value,
@@ -2377,8 +2159,8 @@ const Datetime = class {
2377
2159
  ...this.workingParts,
2378
2160
  year: ev.detail.value,
2379
2161
  });
2380
- // Year wheel is navigation-only in multi-select and range modes as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
2381
- if (!this.isMultipleMode && !this.isRangeMode) {
2162
+ // Year wheel is navigation-only in multi-select mode as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
2163
+ if (!this.multiple) {
2382
2164
  this.setActiveParts({
2383
2165
  ...activePart,
2384
2166
  year: ev.detail.value,
@@ -2522,7 +2304,7 @@ const Datetime = class {
2522
2304
  'calendar-month-disabled': !isWorkingMonth && swipeDisabled,
2523
2305
  } }, index.h("div", { class: "calendar-month-grid" }, getDaysOfMonth(month, year, this.firstDayOfWeek % 7, this.showAdjacentDays).map((dateObject, index$1) => {
2524
2306
  const { day, dayOfWeek, isAdjacentDay } = dateObject;
2525
- const { el, highlightedDates, isDateEnabled, showAdjacentDays } = this;
2307
+ const { el, highlightedDates, isDateEnabled, multiple, showAdjacentDays } = this;
2526
2308
  let _month = month;
2527
2309
  let _year = year;
2528
2310
  if (showAdjacentDays && isAdjacentDay && day !== null) {
@@ -2551,7 +2333,7 @@ const Datetime = class {
2551
2333
  }
2552
2334
  const referenceParts = { month: _month, day, year: _year, isAdjacentDay };
2553
2335
  const isCalendarPadding = day === null;
2554
- const { isActive, isToday, ariaLabel, ariaSelected, disabled: isDayDisabled, isRangeStart, isRangeEnd, isInRange, text, } = getCalendarDayState(this.locale, referenceParts, this.isRangeParts(this.activeParts) ? [] : this.activeParts, this.todayParts, this.minParts, this.maxParts, this.parsedDayValues, this.rangeParts);
2336
+ const { isActive, isToday, ariaLabel, ariaSelected, disabled: isDayDisabled, text, } = getCalendarDayState(this.locale, referenceParts, this.activeParts, this.todayParts, this.minParts, this.maxParts, this.parsedDayValues);
2555
2337
  const dateIsoString = format.convertDataToISO(referenceParts);
2556
2338
  let isCalDayDisabled = isCalMonthDisabled || isDayDisabled;
2557
2339
  if (!isCalDayDisabled && isDateEnabled !== undefined) {
@@ -2574,60 +2356,24 @@ const Datetime = class {
2574
2356
  */
2575
2357
  const isCalDayConstrained = isCalDayDisabled && isDatetimeDisabled;
2576
2358
  const isButtonDisabled = isCalDayDisabled || isDatetimeDisabled;
2577
- /**
2578
- * Determine if this day is part of the range selection.
2579
- * Range styling takes priority over highlightedDates.
2580
- */
2581
- const isPartOfRange = isRangeStart || isRangeEnd || isInRange;
2582
2359
  let dateStyle = undefined;
2583
2360
  /**
2584
- * Custom highlight styles should not override the style for selected dates
2585
- * or range selection, nor apply to "filler days" at the start of the grid.
2361
+ * Custom highlight styles should not override the style for selected dates,
2362
+ * nor apply to "filler days" at the start of the grid.
2586
2363
  */
2587
- if (highlightedDates !== undefined && !isActive && !isPartOfRange && day !== null && !isAdjacentDay) {
2364
+ if (highlightedDates !== undefined && !isActive && day !== null && !isAdjacentDay) {
2588
2365
  dateStyle = getHighlightStyles(highlightedDates, dateIsoString, el);
2589
2366
  }
2590
2367
  let dateParts = undefined;
2591
2368
  // "Filler days" at the beginning of the grid should not get the calendar day
2592
2369
  // CSS parts added to them
2593
2370
  if (!isCalendarPadding && !isAdjacentDay) {
2594
- dateParts = `calendar-day${isActive || isRangeStart || isRangeEnd ? ' active' : ''}${isToday ? ' today' : ''}${isCalDayDisabled ? ' disabled' : ''}${isRangeStart ? ' range-start range-selection' : ''}${isRangeEnd ? ' range-end range-selection' : ''}${isInRange ? ' range-selection' : ''}`;
2371
+ dateParts = `calendar-day${isActive ? ' active' : ''}${isToday ? ' today' : ''}${isCalDayDisabled ? ' disabled' : ''}`;
2595
2372
  }
2596
2373
  else if (isAdjacentDay) {
2597
- /**
2598
- * Adjacent days skip 'active' and 'today' parts but still
2599
- * include range parts so ::part() styling is consistent
2600
- * with the visual range track rendering.
2601
- */
2602
- dateParts = `calendar-day${isCalDayDisabled ? ' disabled' : ''}${isRangeStart ? ' range-start range-selection' : ''}${isRangeEnd ? ' range-end range-selection' : ''}${isInRange ? ' range-selection' : ''}`;
2603
- }
2604
- /**
2605
- * Build the wrapper's shadow part attribute for range track styling.
2606
- */
2607
- const hasCompleteRange = this.rangeParts?.end !== undefined;
2608
- const wrapperParts = isPartOfRange && hasCompleteRange && !isCalendarPadding ? 'range-track' : undefined;
2609
- /**
2610
- * Build the aria-label for range mode accessibility.
2611
- */
2612
- let rangeAriaLabel = ariaLabel;
2613
- if (this.isRangeMode && ariaLabel) {
2614
- if (isRangeStart) {
2615
- rangeAriaLabel += `, ${this.startDateLabel}`;
2616
- }
2617
- if (isRangeEnd) {
2618
- rangeAriaLabel += `, ${this.endDateLabel}`;
2619
- }
2620
- if (isInRange) {
2621
- rangeAriaLabel += ', in range';
2622
- }
2374
+ dateParts = `calendar-day${isCalDayDisabled ? ' disabled' : ''}`;
2623
2375
  }
2624
- return (index.h("div", { class: {
2625
- 'calendar-day-wrapper': true,
2626
- // A start without an end is only the circle until the range is complete
2627
- 'calendar-day-wrapper-range-start': isRangeStart && this.rangeParts?.end !== undefined,
2628
- 'calendar-day-wrapper-in-range': isInRange,
2629
- 'calendar-day-wrapper-range-end': isRangeEnd,
2630
- }, part: wrapperParts }, index.h("button", {
2376
+ return (index.h("div", { class: "calendar-day-wrapper" }, index.h("button", {
2631
2377
  // We need to use !important for the inline styles here because
2632
2378
  // otherwise the CSS shadow parts will override these styles.
2633
2379
  // See https://github.com/WICG/webcomponents/issues/847
@@ -2643,40 +2389,28 @@ const Datetime = class {
2643
2389
  }, tabindex: "-1", "data-day": day, "data-month": _month, "data-year": _year, "data-index": index$1, "data-day-of-week": dayOfWeek, disabled: isButtonDisabled, class: {
2644
2390
  'calendar-day-padding': isCalendarPadding,
2645
2391
  'calendar-day': true,
2646
- 'calendar-day-active': isActive || isRangeStart || isRangeEnd,
2392
+ 'calendar-day-active': isActive,
2647
2393
  'calendar-day-constrained': isCalDayConstrained,
2648
2394
  'calendar-day-today': isToday,
2649
2395
  'calendar-day-adjacent-day': isAdjacentDay,
2650
- 'calendar-day-range-start': isRangeStart,
2651
- 'calendar-day-range-end': isRangeEnd,
2652
- 'calendar-day-in-range': isInRange,
2653
- }, part: dateParts, "aria-hidden": isCalendarPadding ? 'true' : null, "aria-selected": isActive || isRangeStart || isRangeEnd ? 'true' : ariaSelected, "aria-label": rangeAriaLabel, onClick: () => {
2396
+ }, part: dateParts, "aria-hidden": isCalendarPadding ? 'true' : null, "aria-selected": ariaSelected, "aria-label": ariaLabel, onClick: () => {
2654
2397
  if (isCalendarPadding) {
2655
2398
  return;
2656
2399
  }
2657
2400
  if (isAdjacentDay) {
2658
2401
  // The user selected a day outside the current month. Ignore this button, as the month will be re-rendered.
2659
2402
  this.el.blur();
2660
- if (!this.isRangeMode) {
2661
- this.activeParts = { ...activePart, ...referenceParts };
2662
- }
2403
+ this.activeParts = { ...activePart, ...referenceParts };
2663
2404
  this.animateToDate(referenceParts);
2664
- if (this.isRangeMode) {
2665
- this.setActiveParts(referenceParts);
2666
- }
2667
- else {
2668
- this.confirm();
2669
- }
2405
+ this.confirm();
2670
2406
  }
2671
2407
  else {
2672
2408
  this.setWorkingParts({
2673
2409
  ...this.workingParts,
2674
2410
  ...referenceParts,
2675
2411
  });
2676
- if (this.isRangeMode) {
2677
- this.setActiveParts(referenceParts);
2678
- }
2679
- else if (this.isMultipleMode) {
2412
+ // Multiple only needs date info so we can wipe out other fields like time.
2413
+ if (multiple) {
2680
2414
  this.setActiveParts(referenceParts, isActive);
2681
2415
  }
2682
2416
  else {
@@ -2696,17 +2430,7 @@ const Datetime = class {
2696
2430
  })));
2697
2431
  }
2698
2432
  renderCalendar(theme) {
2699
- return (index.h("div", { class: "datetime-calendar", key: "datetime-calendar" }, this.renderCalendarHeader(theme), this.renderCalendarBody(), this.isRangeMode && this.rangeParts && !this.rangeParts.end && (index.h("div", { "aria-live": "polite", role: "status", style: {
2700
- position: 'absolute',
2701
- width: '1px',
2702
- height: '1px',
2703
- padding: '0',
2704
- margin: '-1px',
2705
- overflow: 'hidden',
2706
- clip: 'rect(0, 0, 0, 0)',
2707
- whiteSpace: 'nowrap',
2708
- border: '0',
2709
- } }, `${this.startDateLabel} selected, select ${this.endDateLabel.toLowerCase()}`))));
2433
+ return (index.h("div", { class: "datetime-calendar", key: "datetime-calendar" }, this.renderCalendarHeader(theme), this.renderCalendarBody()));
2710
2434
  }
2711
2435
  renderTimeLabel() {
2712
2436
  const hasSlottedTimeLabel = this.el.querySelector('[slot="time-label"]') !== null;
@@ -2759,23 +2483,10 @@ const Datetime = class {
2759
2483
  ];
2760
2484
  }
2761
2485
  getHeaderSelectedDateText() {
2762
- const { activeParts, formatOptions, titleSelectedDatesFormatter } = this;
2486
+ const { activeParts, formatOptions, multiple, titleSelectedDatesFormatter } = this;
2763
2487
  const isArray = Array.isArray(activeParts);
2764
- const dateFormatOptions = formatOptions?.date ?? { weekday: 'short', month: 'short', day: 'numeric' };
2765
2488
  let headerText;
2766
- if (this.isRangeMode) {
2767
- headerText = this.getRangeHeaderText(formatOptions?.date ?? { month: 'short', day: 'numeric' });
2768
- if (titleSelectedDatesFormatter !== undefined) {
2769
- try {
2770
- const rangeValues = this.getRangeValueArray();
2771
- headerText = titleSelectedDatesFormatter(rangeValues);
2772
- }
2773
- catch (e) {
2774
- index.printIonError('[ion-datetime] - Exception in provided `titleSelectedDatesFormatter`:', e);
2775
- }
2776
- }
2777
- }
2778
- else if (this.isMultipleMode && isArray && activeParts.length !== 1) {
2489
+ if (multiple && isArray && activeParts.length !== 1) {
2779
2490
  headerText = `${activeParts.length} days`; // default/fallback for multiple selection
2780
2491
  if (titleSelectedDatesFormatter !== undefined) {
2781
2492
  try {
@@ -2788,37 +2499,10 @@ const Datetime = class {
2788
2499
  }
2789
2500
  else {
2790
2501
  // for exactly 1 day selected (multiple set or not), show a formatted version of that
2791
- headerText = format.getLocalizedDateTime(this.locale, this.getActivePartsWithFallback(), dateFormatOptions);
2502
+ headerText = format.getLocalizedDateTime(this.locale, this.getActivePartsWithFallback(), formatOptions?.date ?? { weekday: 'short', month: 'short', day: 'numeric' });
2792
2503
  }
2793
2504
  return headerText;
2794
2505
  }
2795
- /**
2796
- * Returns the formatted range header text.
2797
- * Shows "Start date - End date" with placeholders from startDateLabel/endDateLabel.
2798
- */
2799
- getRangeHeaderText(dateFormatOptions) {
2800
- const range = this.rangeParts;
2801
- if (!range) {
2802
- return `${this.startDateLabel} - ${this.endDateLabel}`;
2803
- }
2804
- const startText = format.getLocalizedDateTime(this.locale, range.start, dateFormatOptions);
2805
- const endText = range.end ? format.getLocalizedDateTime(this.locale, range.end, dateFormatOptions) : this.endDateLabel;
2806
- return `${startText} - ${endText}`;
2807
- }
2808
- /**
2809
- * Returns the current range value as an ISO string array for
2810
- * titleSelectedDatesFormatter and ionChange.
2811
- */
2812
- getRangeValueArray() {
2813
- const range = this.rangeParts;
2814
- if (!range) {
2815
- return [];
2816
- }
2817
- if (!range.end) {
2818
- return [format.convertDataToISO(range.start)];
2819
- }
2820
- return [format.convertDataToISO(range.start), format.convertDataToISO(range.end)];
2821
- }
2822
2506
  renderHeader(showExpandedHeader = true) {
2823
2507
  const hasSlottedTitle = this.el.querySelector('[slot="title"]') !== null;
2824
2508
  if (!hasSlottedTitle && !this.showDefaultTitle) {
@@ -2942,7 +2626,7 @@ const Datetime = class {
2942
2626
  const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
2943
2627
  const hasWheelVariant = hasDatePresentation && preferWheel;
2944
2628
  helpers.renderHiddenInput(true, el, name, format.formatValue(value), disabled);
2945
- return (index.h(index.Host, { key: '0a05835fa52e91147d72250941201b89fd850dda', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: {
2629
+ return (index.h(index.Host, { key: '6ee2389238b42b0d10c5f5254a8ba61bfc53c677', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: {
2946
2630
  ...theme.createColorClasses(color, {
2947
2631
  [theme$1]: true,
2948
2632
  ['datetime-readonly']: readonly,
@@ -2953,9 +2637,8 @@ const Datetime = class {
2953
2637
  [`datetime-size-${size}`]: true,
2954
2638
  [`datetime-prefer-wheel`]: hasWheelVariant,
2955
2639
  [`datetime-grid`]: isGridStyle,
2956
- [`datetime-range`]: this.isRangeMode,
2957
2640
  }),
2958
- } }, index.h("div", { key: '5b5d6999f55b85523f65763a906f7f16c25f2eb2', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(theme$1)));
2641
+ } }, index.h("div", { key: '531803dfb77fa3d694c90b6fc45e71e304876fa8', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(theme$1)));
2959
2642
  }
2960
2643
  get el() { return index.getElement(this); }
2961
2644
  static get watchers() { return {