npm - @ionic/core - Versions diffs - 8.0.2 → 8.1.0 - Mend

@ionic/core 8.0.2 → 8.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (431) hide show

package/css/ionic.bundle.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sourceRoot":"","sources":["../src/css/core.scss","../src/themes/ionic.mixins.scss","../src/themes/ionic.globals.scss","../src/components/menu/menu.ios.vars.scss","../src/components/menu/menu.md.vars.scss","../src/css/normalize.scss","../src/css/structure.scss","../src/css/typography.scss","../src/css/padding.scss","../src/css/float-elements.scss","../src/css/text-alignment.scss","../src/css/text-transformation.scss","../src/css/flex-utils.scss","../src/css/display.scss"],"names":[],"mappings":"AAKA,MAOI,6BACA,oCACA,mCACA,gDACA,mCACA,kCALA,+BACA,sCACA,qCACA,kDACA,qCACA,oCALA,8BACA,sCACA,oCACA,iDACA,oCACA,mCALA,6BACA,qCACA,mCACA,0CACA,mCACA,kCALA,6BACA,qCACA,mCACA,0CACA,mCACA,kCALA,4BACA,mCACA,kCACA,+CACA,kCACA,iCALA,2BACA,qCACA,iCACA,wCACA,iCACA,gCALA,4BACA,qCACA,kCACA,+CACA,kCACA,iCALA,0BACA,iCACA,gCACA,6CACA,gCACA,+BAOJ,SACE,8FAEF,QACE,2DAGF,KACE,uCACA,2CAGF,KACE,uCACA,4BAGF,wBACE,gBAYF,+LAGE,gBAQF,qIAEE,mBAQF,+BACE,qDACA,mDAOF,qCACE,4CACE,0BA+BJ,2DACE,sBACA,mBAaF,wCACE,4CAyBA,mBATA,+DACA,0EACA,yEACA,0FACA,sEACA,oEAIA,qBATA,iEACA,4EACA,2EACA,4FACA,wEACA,sEAIA,oBATA,gEACA,4EACA,0EACA,2FACA,uEACA,qEAIA,mBATA,+DACA,2EACA,yEACA,oFACA,sEACA,oEAIA,mBATA,+DACA,2EACA,yEACA,oFACA,sEACA,oEAIA,kBATA,8DACA,yEACA,wEACA,yFACA,qEACA,mEAIA,iBATA,6DACA,2EACA,uEACA,kFACA,oEACA,kEAIA,kBATA,8DACA,2EACA,wEACA,yFACA,qEACA,mEAIA,gBATA,4DACA,uEACA,sEACA,uFACA,mEACA,iEAaF,UCsOM,KDrOuB,ECsOvB,MDtOiB,EC0PrB,ID1PkB,EC2PlB,OD3PwB,EAExB,aACA,kBAEA,sBACA,8BAEA,0BACA,QExH+B,EFmIjC,oBACE,kBAEA,qBAEA,YAGF,8CACE,kBAGF,iRAeE,wBAGF,oBACE,UAGF,wCACE,cAOF,6CACE,8BAGF,6BACE,KACE,mDAIJ,iDACE,KACE,8CACA,oDACA,gDACA,mDAQJ,mFAEE,cAOF,cC8TM,iCD1TN,mBACE,eACA,0BAUA,oBAMA,kBAUF,+BACE,mBAGF,4CACE,gBAGF,0BACE,WGtS+B,4BHySjC,mCACE,WGvS+B,2BH8SjC,yBACE,WIrT8B,6BJwThC,uBACE,WIzT8B,6BJ6ThC,6EACE,2BACA,4BAEF,4EACE,8BACA,+BAEF,qEACE,oBAGF,0EACE,2DAGF,uCACE,yCAEE,4BASJ,qJAEE,yBAGF,2GACE,oBACA,0BAGF,uMAEE,aAMF,6CACE,iBASF,6BACE,qBACA,sBAUF,wDACE,YACA,iBAaF,oCACE,gBAUF,4CACE,kBACE,iBK5ZJ,4BAIE,wBAKF,sBACE,aAEA,SAQF,SAEE,iBAOF,IACE,eAMF,GACE,WAEA,eAEA,uBAIF,IACE,cAIF,kBAIE,gCACA,cAgBF,4BAIE,oBACA,mBAGF,SACE,cAEA,YAEA,aACA,cAGF,sBACE,iBAGF,2BAIE,SAEA,aACA,cAQF,6DAGE,eAEA,0BAIF,qNAkBE,0BAGF,6BAEE,oBAGF,OACE,UACA,SACA,gBACA,oBACA,mBACA,qBACA,cACA,oBACA,eAEA,0BAGF,WACE,eAIF,kDAGE,eAIF,iDAEE,UAEA,SAMF,4FAEE,YAMF,+FAEE,wBAQF,MACE,yBACA,iBAGF,MAEE,UC1MF,EACE,sBAEA,0CACA,wCACA,2BAGF,KACE,WACA,YACA,8BAEA,sBAGF,yBACE,aAGF,iBACE,cAGF,aACE,aAGF,KL0EE,kCACA,mCA0NE,YKnSc,ELoSd,aKpSc,ELwThB,WKxTgB,ELyThB,cKzTgB,ELmSd,aKlSe,ELmSf,cKnSe,ELuTjB,YKvTiB,ELwTjB,eKxTiB,EAEjB,eAEA,WACA,eACA,YACA,gBAsBA,wBAEA,kCAEA,gBAEA,0BAEA,uBAEA,yBAEA,qBAEA,2BACA,8BAEA,sBCvDF,KACE,mCAOF,uCACE,KAIE,2DAIJ,EACE,6BACA,wCAGF,kBN0SE,WMpSgB,KNqShB,cMrS4B,KAE5B,YArD6B,IAuD7B,YApD6B,IAuD/B,GN6RE,WM5RgB,KAEhB,UAvD6B,SA0D/B,GNuRE,WMtRgB,KAEhB,UA1D6B,OA6D/B,GACE,UA3D6B,SA8D/B,GACE,UA5D6B,QA+D/B,GACE,UA7D6B,SAgE/B,GACE,UA9D6B,KAiE/B,MACE,cAGF,QAEE,kBAEA,cAEA,cAEA,wBAGF,IACE,WAGF,IACE,eClGF,gBACE,mBACA,iBACA,iBACA,oBPsTE,aOpTe,EPqTf,cOrTe,EPyUjB,YOzUiB,EP0UjB,eO1UiB,EAGnB,aACE,0CACA,wCACA,wCACA,2CPiTE,sBOpUM,yBPqUN,qBOrUM,yBPsUN,oBOtUM,yBPuUN,mBOvUM,yBPqVR,YOrVQ,yBPsVR,eOtVQ,yBAwBV,iBACE,wCP4TA,YOrVQ,yBA8BV,mBACE,0CPqSE,sBOpUM,yBPqUN,qBOrUM,yBAoCV,iBACE,wCPiSE,oBOtUM,yBPuUN,mBOvUM,yBA0CV,oBACE,2CP2SA,eOtVQ,yBAgDV,sBACE,wCACA,2CPmSA,YOrVQ,yBPsVR,eOtVQ,yBAuDV,wBACE,0CACA,wCP2QE,sBOpUM,yBPqUN,qBOrUM,yBPsUN,oBOtUM,yBPuUN,mBOvUM,yBAkEV,eACE,kBACA,gBACA,gBACA,mBP0PE,YOxPc,EPyPd,aOzPc,EP6QhB,WO7QgB,EP8QhB,cO9QgB,EAGlB,YACE,wCACA,sCACA,sCACA,yCPqPE,qBOnUK,wBPoUL,oBOpUK,wBPqUL,mBOrUK,wBPsUL,kBOtUK,wBPoVP,WOpVO,wBPqVP,cOrVO,wBAmFT,gBACE,sCPgQA,WOpVO,wBAyFT,kBACE,wCPyOE,qBOnUK,wBPoUL,oBOpUK,wBA+FT,gBACE,sCPqOE,mBOrUK,wBPsUL,kBOtUK,wBAqGT,mBACE,yCP+OA,cOrVO,wBA2GT,qBACE,sCACA,yCPuOA,WOpVO,wBPqVP,cOrVO,wBAkHT,uBACE,wCACA,sCP+ME,qBOnUK,wBPoUL,oBOpUK,wBPqUL,mBOrUK,wBPsUL,kBOtUK,wBCGL,gBR2dE,sBQvdF,iBRudE,uBQndF,iBRqcE,sBAzNO,0CA4NP,uBArNO,2BAqNP,uBA/MJ,8BAcW,0BAiMP,wBQpcF,eRwcE,uBAhOO,wCAmOP,sBA5NO,yBA4NP,sBAtNJ,8BAcW,wBAwMP,uBAnUF,yBQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBAnUF,yBQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBAnUF,yBQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBAnUF,0BQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBSvdF,iBACE,6BAGF,kBACE,8BAGF,gBACE,4BAGF,cACE,0BAGF,eACE,2BAGF,gBACE,4BAGF,iBACE,8BAGF,eACE,8BTuHF,yBSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BTuHF,yBSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BTuHF,yBSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BTuHF,0BSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BC7BF,oBAEE,oCAGF,oBAEE,oCAGF,qBAEE,qCVwIF,yBUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCVwIF,yBUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCVwIF,yBUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCVwIF,0BUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCCjBN,sBACE,iCAGF,oBACE,+BAGF,uBACE,6BAGF,wBACE,8BAGF,yBACE,+BAGF,qBACE,2BAOF,UACE,0BAGF,YACE,4BAGF,kBACE,kCAOF,2BACE,sCAGF,4BACE,kCAGF,yBACE,oCAGF,4BACE,wCAGF,6BACE,yCAGF,4BACE,wCAOF,uBACE,kCAGF,wBACE,8BAGF,qBACE,gCAGF,yBACE,+BAGF,0BACE,gCC1FF,UACE,wBAUE,aACE,wBAOF,eACE,wBZsIF,yBY/IA,gBACE,yBZuLF,4BYhLA,kBACE,yBZsIF,yBY/IA,gBACE,yBZuLF,4BYhLA,kBACE,yBZsIF,yBY/IA,gBACE,yBZuLF,4BYhLA,kBACE,yBZsIF,0BY/IA,gBACE,yBZuLF,6BYhLA,kBACE","file":"ionic.bundle.css","sourcesContent":["@use \"sass:map\";\n@import \"../themes/ionic.globals\";\n@import \"../components/menu/menu.ios.vars\";\n@import \"../components/menu/menu.md.vars\";\n\n:root {\n /*\n Loop through each color object from the\n * `ionic.theme.default.scss` file\n * and generate CSS Variables for each color.\n /\n @each $color-name, $value in $colors {\n --ion-color-#{$color-name}: #{map.get($value, base)};\n --ion-color-#{$color-name}-rgb: #{color-to-rgb-list(map.get($value, base))};\n --ion-color-#{$color-name}-contrast: #{map.get($value, contrast)};\n --ion-color-#{$color-name}-contrast-rgb: #{color-to-rgb-list(map.get($value, contrast))};\n --ion-color-#{$color-name}-shade: #{map.get($value, shade)};\n --ion-color-#{$color-name}-tint: #{map.get($value, tint)};\n }\n}\n\n// Ionic Font Family\n// --------------------------------------------------\n\nhtml.ios {\n --ion-default-font: -apple-system, BlinkMacSystemFont, \"Helvetica Neue\", \"Roboto\", sans-serif;\n}\nhtml.md {\n --ion-default-font: \"Roboto\", \"Helvetica Neue\", sans-serif;\n}\n\nhtml {\n --ion-dynamic-font: -apple-system-body;\n --ion-font-family: var(--ion-default-font);\n}\n\nbody {\n background: var(--ion-background-color);\n color: var(--ion-text-color);\n}\n\nbody.backdrop-no-scroll {\n overflow: hidden;\n}\n\n// Modal - Card Style\n// --------------------------------------------------\n/\n Card style modal needs additional padding on the\n * top of the header. We accomplish this by targeting\n * the first toolbar in the header.\n * Footer also needs this. We do not adjust the bottom\n * padding though because of the safe area.\n /\nhtml.ios ion-modal.modal-card ion-header ion-toolbar:first-of-type,\nhtml.ios ion-modal.modal-sheet ion-header ion-toolbar:first-of-type,\nhtml.ios ion-modal ion-footer ion-toolbar:first-of-type {\n padding-top: 6px;\n}\n\n/\n Card style modal needs additional padding on the\n* bottom of the header. We accomplish this by targeting\n* the last toolbar in the header.\n/\nhtml.ios ion-modal.modal-card ion-header ion-toolbar:last-of-type,\nhtml.ios ion-modal.modal-sheet ion-header ion-toolbar:last-of-type {\n padding-bottom: 6px;\n}\n\n/\n Add padding on the left and right\n* of toolbars while accounting for\n* safe area values when in landscape.\n/\nhtml.ios ion-modal ion-toolbar {\n padding-right: calc(var(--ion-safe-area-right) + 8px);\n padding-left: calc(var(--ion-safe-area-left) + 8px);\n}\n\n/\n Card style modal on iPadOS\n * should only have backdrop on first instance.\n /\n@media screen and (min-width: 768px) {\n html.ios ion-modal.modal-card:first-of-type {\n --backdrop-opacity: 0.18;\n }\n}\n\n/\n Subsequent modals should not have a backdrop/box shadow\n * as it will cause the screen to appear to get progressively\n * darker. With Ionic 6, declarative modals made it\n * possible to have multiple non-presented modals in the DOM,\n * so we could no longer rely on ion-modal:first-of-type.\n * Here we disable the opacity/box-shadow for every modal\n * that comes after the first presented modal.\n \n Note: ion-modal:not(.overlay-hidden):first-of-type\n * does not match the first modal to not have\n * the .overlay-hidden class, it will match the\n * first modal in general only if it does not\n * have the .overlay-hidden class.\n * The :nth-child() pseudo-class has support\n * for selectors which would help us here. At the\n * time of writing it does not have great cross browser\n * support.\n \n Note 2: This should only apply to non-card and\n * non-sheet modals. Card and sheet modals have their\n * own criteria for displaying backdrops/box shadows.\n \n Do not use :not(.overlay-hidden) in place of\n * .show-modal because that triggers a memory\n * leak in Blink: https://bugs.chromium.org/p/chromium/issues/detail?id=1418768\n /\nion-modal.modal-default.show-modal ~ ion-modal.modal-default {\n --backdrop-opacity: 0;\n --box-shadow: none;\n}\n\n/\n This works around a bug in WebKit where the\n * content will overflow outside of the bottom border\n * radius when re-painting. As long as a single\n * border radius value is set on .ion-page, this\n * issue does not happen. We set the top left radius\n * here because the top left corner will always have a\n * radius no matter the platform.\n * This behavior only applies to card modals.\n /\nhtml.ios ion-modal.modal-card .ion-page {\n border-top-left-radius: var(--border-radius);\n}\n\n// Ionic Colors\n// --------------------------------------------------\n// Generates the color classes and variables based on the\n// colors map\n\n@mixin generate-color($color-name) {\n $value: map-get($colors, $color-name);\n\n $base: map-get($value, base);\n $contrast: map-get($value, contrast);\n $shade: map-get($value, shade);\n $tint: map-get($value, tint);\n\n --ion-color-base: var(--ion-color-#{$color-name}, #{$base}) !important;\n --ion-color-base-rgb: var(--ion-color-#{$color-name}-rgb, #{color-to-rgb-list($base)}) !important;\n --ion-color-contrast: var(--ion-color-#{$color-name}-contrast, #{$contrast}) !important;\n --ion-color-contrast-rgb: var(--ion-color-#{$color-name}-contrast-rgb, #{color-to-rgb-list($contrast)}) !important;\n --ion-color-shade: var(--ion-color-#{$color-name}-shade, #{$shade}) !important;\n --ion-color-tint: var(--ion-color-#{$color-name}-tint, #{$tint}) !important;\n}\n\n@each $color-name, $value in $colors {\n .ion-color-#{$color-name} {\n @include generate-color($color-name);\n }\n}\n\n\n// Page Container Structure\n// --------------------------------------------------\n\n.ion-page {\n @include position(0, 0, 0, 0);\n\n display: flex;\n position: absolute;\n\n flex-direction: column;\n justify-content: space-between;\n\n contain: layout size style;\n z-index: $z-index-page-container;\n}\n\n/\n When making custom dialogs, using\n * ion-content is not required. As a result,\n * some developers may wish to have dialogs\n * that are automatically sized by the browser.\n * These changes allow certain dimension values\n * such as fit-content to work correctly.\n /\nion-modal > .ion-page {\n position: relative;\n\n contain: layout style;\n\n height: 100%;\n}\n\n.split-pane-visible > .ion-page.split-pane-main {\n position: relative;\n}\n\nion-route,\nion-route-redirect,\nion-router,\nion-select-option,\nion-nav-controller,\nion-menu-controller,\nion-action-sheet-controller,\nion-alert-controller,\nion-loading-controller,\nion-modal-controller,\nion-picker-controller,\nion-popover-controller,\nion-toast-controller,\n.ion-page-hidden {\n / stylelint-disable-next-line declaration-no-important /\n display: none !important;\n}\n\n.ion-page-invisible {\n opacity: 0;\n}\n\n.can-go-back > ion-header ion-back-button {\n display: block;\n}\n\n\n// Ionic Safe Margins\n// --------------------------------------------------\n\nhtml.plt-ios.plt-hybrid, html.plt-ios.plt-pwa {\n --ion-statusbar-padding: 20px;\n}\n\n@supports (padding-top: 20px) {\n html {\n --ion-safe-area-top: var(--ion-statusbar-padding);\n }\n}\n\n@supports (padding-top: env(safe-area-inset-top)) {\n html {\n --ion-safe-area-top: env(safe-area-inset-top);\n --ion-safe-area-bottom: env(safe-area-inset-bottom);\n --ion-safe-area-left: env(safe-area-inset-left);\n --ion-safe-area-right: env(safe-area-inset-right);\n }\n}\n\n\n// Global Card Styles\n// --------------------------------------------------\n\nion-card.ion-color .ion-inherit-color,\nion-card-header.ion-color .ion-inherit-color {\n color: inherit;\n}\n\n\n// Menu Styles\n// --------------------------------------------------\n\n.menu-content {\n @include transform(translate3d(0, 0, 0));\n}\n\n.menu-content-open {\n cursor: pointer;\n touch-action: manipulation;\n\n /\n The containing element itself should be clickable but\n * everything inside of it should not clickable when menu is open\n \n Setting pointer-events after scrolling has already started\n * will not cancel scrolling which is why we also set\n * overflow-y below.\n /\n pointer-events: none;\n\n /\n This accounts for scenarios where the main content itself\n * is scrollable.\n /\n overflow-y: hidden;\n}\n\n/\n Setting overflow cancels any in-progress scrolling\n * when the menu opens. This prevents users from accidentally\n * scrolling the main content while also dragging the menu open.\n * The code below accounts for both ion-content and then custom\n * scroll containers within ion-content (such as virtual scroll)\n /\n.menu-content-open ion-content {\n --overflow: hidden;\n}\n\n.menu-content-open .ion-content-scroll-host {\n overflow: hidden;\n}\n\n.ios .menu-content-reveal {\n box-shadow: $menu-ios-box-shadow-reveal;\n}\n\n[dir=rtl].ios .menu-content-reveal {\n box-shadow: $menu-ios-box-shadow-reveal-rtl;\n}\n\n.ios .menu-content-push {\n box-shadow: $menu-ios-box-shadow-push;\n}\n\n.md .menu-content-reveal {\n box-shadow: $menu-md-box-shadow;\n}\n\n.md .menu-content-push {\n box-shadow: $menu-md-box-shadow;\n}\n\n// Accordion Styles\nion-accordion-group.accordion-group-expand-inset > ion-accordion:first-of-type {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n}\nion-accordion-group.accordion-group-expand-inset > ion-accordion:last-of-type {\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n}\nion-accordion-group > ion-accordion:last-of-type ion-item[slot=\"header\"] {\n --border-width: 0px;\n}\n\nion-accordion.accordion-animated > [slot=\"header\"] .ion-accordion-toggle-icon {\n transition: 300ms transform cubic-bezier(0.25, 0.8, 0.5, 1);\n}\n\n@media (prefers-reduced-motion: reduce) {\n ion-accordion .ion-accordion-toggle-icon {\n / stylelint-disable declaration-no-important /\n transition: none !important;\n }\n}\n/\n The > [slot=\"header\"] selector ensures that we do\n * not modify toggle icons for any nested accordions. The state\n * of one accordion should not affect any accordions inside\n * of a nested accordion group.\n /\nion-accordion.accordion-expanding > [slot=\"header\"] .ion-accordion-toggle-icon,\nion-accordion.accordion-expanded > [slot=\"header\"] .ion-accordion-toggle-icon {\n transform: rotate(180deg);\n}\n\nion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-previous ion-item[slot=\"header\"] {\n --border-width: 0px;\n --inner-border-width: 0px;\n}\n\nion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-expanding:first-of-type,\nion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-expanded:first-of-type {\n margin-top: 0;\n}\n\n// Safari/iOS 15 changes the appearance of input[type=\"date\"].\n// For backwards compatibility from Ionic 5/Safari 14 designs,\n// we override the appearance only when using within an ion-input.\nion-input input::-webkit-date-and-time-value {\n text-align: start;\n}\n\n/\n The .ion-datetime-button-overlay class contains\n * styles that allow any modal/popover to be\n * sized according to the dimensions of the datetime\n * when used with ion-datetime-button.\n /\n.ion-datetime-button-overlay {\n --width: fit-content;\n --height: fit-content;\n}\n\n/\n The grid variant can scale down when inline.\n * When used in a `fit-content` overlay, this causes\n * the overlay to shrink when the month/year picker is open.\n * Explicitly setting the dimensions lets us have a consistently\n * sized grid interface.\n /\n.ion-datetime-button-overlay ion-datetime.datetime-grid {\n width: 320px;\n min-height: 320px;\n}\n\n/\n If a popover has a child ion-content (or class equivalent) then the .popover-viewport element\n * should not be scrollable to ensure the inner content does scroll. However, if the popover\n * does not have a child ion-content (or class equivalent) then the .popover-viewport element\n * should remain scrollable. This code exists globally because popover targets\n * .popover-viewport using ::slotted which only supports simple selectors.\n \n Note that we do not need to account for .ion-content-scroll-host here because that\n * class should always be placed within ion-content even if ion-content is not scrollable.\n /\n.popover-viewport:has(> ion-content) {\n overflow: hidden;\n}\n\n/\n :has has cross-browser support, but it is still relatively new. As a result,\n * we should fallback to the old behavior for environments that do not support :has.\n * Developers can explicitly enable this behavior by setting overflow: visible\n * on .popover-viewport if they know they are not going to use an ion-content.\n * TODO FW-6106 Remove this\n /\n@supports not selector(:has(> ion-content)) {\n .popover-viewport {\n overflow: hidden;\n }\n}\n","\n/\n A heuristic that applies CSS to tablet\n * viewports.\n \n Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n /\n@mixin tablet-viewport() {\n @media screen and (min-width: 768px) {\n @content;\n }\n}\n\n/\n A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n \n Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n /\n@mixin mobile-viewport() {\n @media screen and (max-width: 767px) {\n @content;\n }\n}\n\n@mixin input-cover() {\n @include position(0, null, null, 0);\n @include margin(0);\n\n position: absolute;\n\n width: 100%;\n height: 100%;\n\n border: 0;\n background: transparent;\n cursor: pointer;\n\n appearance: none;\n outline: none;\n\n &::-moz-focus-inner {\n border: 0;\n }\n}\n\n@mixin visually-hidden() {\n position: absolute;\n\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n width: 100%;\n height: 100%;\n\n margin: 0;\n padding: 0;\n\n border: 0;\n outline: 0;\n clip: rect(0 0 0 0);\n\n opacity: 0;\n overflow: hidden;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n@mixin text-inherit() {\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n letter-spacing: inherit;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n text-align: inherit;\n white-space: inherit;\n color: inherit;\n}\n\n@mixin button-state() {\n @include position(0, 0, 0, 0);\n\n position: absolute;\n\n content: \"\";\n\n opacity: 0;\n}\n\n// Font smoothing\n// --------------------------------------------------\n\n@mixin font-smoothing() {\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n}\n\n// Get the key from a map based on the index\n@function index-to-key($map, $index) {\n $keys: map-keys($map);\n\n @return nth($keys, $index);\n}\n\n\n// Breakpoint Mixins\n// ---------------------------------------------------------------------------------\n\n// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$screen-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// ---------------------------------------------------------------------------------\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $screen-breakpoints) {\n $min: map-get($breakpoints, $name);\n\n @return if($name != index-to-key($breakpoints, 1), $min, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $screen-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, \"\", \"-#{$name}\");\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $screen-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next($name, $breakpoints: $screen-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Maximum breakpoint width. Null for the smallest (first) breakpoint.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n//\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\t// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\t// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $screen-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - .02, null);\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $screen-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n\n// Text Direction - ltr / rtl\n//\n// CSS defaults to use the ltr css, and adds [dir=rtl] selectors\n// to override ltr defaults.\n// ----------------------------------------------------------\n\n@mixin multi-dir() {\n @content;\n\n // $root: #{&};\n // @at-root [dir] {\n // #{$root} {\n // @content;\n // }\n // }\n}\n\n@mixin rtl() {\n $root: #{&};\n\n $rootSplit: str-split($root, \",\");\n $selectors: #{add-root-selector($root, \"[dir=rtl]\")};\n $selectorsSplit: str-split($selectors, \",\");\n\n $hostContextSelectors: ();\n $restSelectors: ();\n $dirSelectors: ();\n\n // Selectors must be split into individual selectors in case the browser\n // doesn't support a specific selector.\n // For example, Firefox and Safari doesn't support `:host-context()`.\n // If an invalid selector is used, then the entire group of selectors\n // will be ignored.\n // @link https://www.w3.org/TR/selectors-3/#grouping\n @each $selector in $selectorsSplit {\n // Group the selectors back into a single selector to optimize the output.\n @if str-index($selector, \":host-context\") {\n $hostContextSelectors: append($hostContextSelectors, $selector, comma);\n } @else {\n // Group the selectors back into a single selector to optimize the output.\n $restSelectors: append($restSelectors, $selector, comma);\n }\n }\n\n // Supported by Chrome.\n @if length($hostContextSelectors) > 0 {\n @at-root #{$hostContextSelectors} {\n @content;\n }\n }\n\n // Supported by all browsers.\n @if length($restSelectors) > 0 {\n @at-root #{$restSelectors} {\n @content;\n }\n }\n\n // If browser can support `:dir()`, then add the `:dir()` selectors.\n @supports selector(:dir(rtl)) {\n // Adding :dir() in case the browser doesn't support `:host-context()` and does support `:dir()`.\n // `:host-context()` is added:\n // - through the `add-root-selector()` function.\n // - first so that it takes precedence over `:dir()`.\n // For example,\n // - Firefox doesn't support `:host-context()`, but does support `:dir()`.\n // - Safari doesn't support `:host-context()`, but Safari 16.4+ supports `:dir()`\n // @link https://webkit.org/blog/13966/webkit-features-in-safari-16-4/\n // -- However, there is a Webkit bug on v16 that prevents `:dir()` from working when\n // -- the app direction is changed dynamically. v17+ works fine.\n // -- @link https://bugs.webkit.org/show_bug.cgi?id=257133\n\n // Supported by Firefox.\n @at-root #{add-root-selector($root, \":dir(rtl)\", false)} {\n @content;\n }\n }\n}\n\n@mixin ltr() {\n @content;\n}\n\n\n// SVG Background Image Mixin\n// @param {string} $svg\n// ----------------------------------------------------------\n@mixin svg-background-image($svg, $flip-rtl: false) {\n $url: url-encode($svg);\n $viewBox: str-split(str-extract($svg, \"viewBox='\", \"'\"), \" \");\n\n @if $flip-rtl != true or $viewBox == null {\n @include multi-dir() {\n background-image: url(\"data:image/svg+xml;charset=utf-8,#{$url}\");\n }\n } @else {\n $transform: \"transform='translate(#{nth($viewBox, 3)}, 0) scale(-1, 1)'\";\n $flipped-url: $svg;\n $flipped-url: str-replace($flipped-url, \"<path\", \"<path #{$transform}\");\n $flipped-url: str-replace($flipped-url, \"<line\", \"<line #{$transform}\");\n $flipped-url: str-replace($flipped-url, \"<polygon\", \"<polygon #{$transform}\");\n $flipped-url: url-encode($flipped-url);\n\n @include ltr () {\n background-image: url(\"data:image/svg+xml;charset=utf-8,#{$url}\");\n }\n @include rtl() {\n background-image: url(\"data:image/svg+xml;charset=utf-8,#{$flipped-url}\");\n }\n }\n}\n\n// Add property horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin property-horizontal($prop, $start, $end: $start) {\n @if $start == 0 and $end == 0 {\n #{$prop}-left: $start;\n #{$prop}-right: $end;\n\n } @else {\n -webkit-#{$prop}-start: $start;\n #{$prop}-inline-start: $start;\n -webkit-#{$prop}-end: $end;\n #{$prop}-inline-end: $end;\n }\n}\n\n// Add property for all directions\n// @param {string} $prop\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// @param {boolean} $content include content or use default\n// ----------------------------------------------------------\n@mixin property($prop, $top, $end: $top, $bottom: $top, $start: $end) {\n @include property-horizontal($prop, $start, $end);\n #{$prop}-top: $top;\n #{$prop}-bottom: $bottom;\n}\n\n// Add padding horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin padding-horizontal($start, $end: $start) {\n @include property-horizontal(padding, $start, $end);\n}\n\n// Add padding for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin padding($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(padding, $top, $end, $bottom, $start);\n}\n\n// Add margin horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin margin-horizontal($start, $end: $start) {\n @include property-horizontal(margin, $start, $end);\n}\n\n// Add margin for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin margin($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(margin, $top, $end, $bottom, $start);\n}\n\n// Add position horizontal\n// @param {string} $start - amount to position start\n// @param {string} $end - amount to left: 0; end\n// ----------------------------------------------------------\n@mixin position-horizontal($start: null, $end: null) {\n @if $start == $end {\n @include multi-dir() {\n left: $start;\n right: $end;\n }\n } @else {\n @at-root {\n & {\n inset-inline-start: $start;\n inset-inline-end: $end;\n }\n }\n }\n}\n\n// Add position for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin position($top: null, $end: null, $bottom: null, $start: null) {\n @include position-horizontal($start, $end);\n top: $top;\n bottom: $bottom;\n}\n\n// Add border for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin border($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(border, $top, $end, $bottom, $start);\n}\n\n// Add border radius for all directions\n// @param {string} $top-start\n// @param {string} $top-end\n// @param {string} $bottom-end\n// @param {string} $bottom-start\n// ----------------------------------------------------------\n@mixin border-radius($top-start, $top-end: $top-start, $bottom-end: $top-start, $bottom-start: $top-end) {\n @if $top-start == $top-end and $top-start == $bottom-end and $top-start == $bottom-start {\n border-radius: $top-start;\n } @else {\n border-start-start-radius: $top-start;\n border-start-end-radius: $top-end;\n border-end-end-radius: $bottom-end;\n border-end-start-radius: $bottom-start;\n }\n}\n\n// Add direction for all directions\n// @param {string} $dir - Direction on LTR\n@mixin direction($dir) {\n $other-dir: null;\n\n @if $dir == ltr {\n $other-dir: rtl;\n } @else {\n $other-dir: ltr;\n }\n\n @include ltr() {\n direction: $dir;\n }\n @include rtl() {\n direction: $other-dir;\n }\n}\n\n// Add float for all directions\n// @param {string} $side\n// @param {string} $decorator - !important\n@mixin float($side, $decorator: null) {\n @if $side == start {\n @include ltr() {\n float: left $decorator;\n }\n @include rtl() {\n float: right $decorator;\n }\n } @else if $side == end {\n @include ltr() {\n float: right $decorator;\n }\n @include rtl() {\n float: left $decorator;\n }\n } @else {\n @include multi-dir() {\n float: $side $decorator;\n }\n }\n}\n\n@mixin background-position($horizontal, $horizontal-amount: null, $vertical: null, $vertical-amount: null) {\n @if $horizontal == start or $horizontal == end {\n $horizontal-ltr: null;\n $horizontal-rtl: null;\n @if $horizontal == start {\n $horizontal-ltr: left;\n $horizontal-rtl: right;\n } @else {\n $horizontal-ltr: right;\n $horizontal-rtl: left;\n }\n\n @include ltr() {\n background-position: $horizontal-ltr $horizontal-amount $vertical $vertical-amount;\n }\n @include rtl() {\n background-position: $horizontal-rtl $horizontal-amount $vertical $vertical-amount;\n }\n } @else {\n @include multi-dir() {\n background-position: $horizontal $horizontal-amount $vertical $vertical-amount;\n }\n }\n}\n\n@mixin transform-origin($x-axis, $y-axis: null) {\n @if $x-axis == start {\n @include ltr() {\n transform-origin: left $y-axis;\n }\n @include rtl() {\n transform-origin: right $y-axis;\n }\n } @else if $x-axis == end {\n @include ltr() {\n transform-origin: right $y-axis;\n }\n @include rtl() {\n transform-origin: left $y-axis;\n }\n } @else if $x-axis == left or $x-axis == right {\n @include multi-dir() {\n transform-origin: $x-axis $y-axis;\n }\n } @else {\n @include ltr() {\n transform-origin: $x-axis $y-axis;\n }\n @include rtl() {\n transform-origin: calc(100% - #{$x-axis}) $y-axis;\n }\n }\n}\n\n// Add transform for all directions\n// @param {string} $transforms - comma separated list of transforms\n@mixin transform($transforms...) {\n $extra: null;\n\n $x: null;\n $ltr-translate: null;\n $rtl-translate: null;\n\n @each $transform in $transforms {\n @if (str-index($transform, translate3d)) {\n $transform: str-replace($transform, 'translate3d(');\n $transform: str-replace($transform, ')');\n\n $coordinates: str-split($transform, ',');\n\n $x: nth($coordinates, 1);\n $y: nth($coordinates, 2);\n $z: nth($coordinates, 3);\n\n $ltr-translate: translate3d($x, $y, $z);\n $rtl-translate: translate3d(calc(-1 #{$x}), $y, $z);\n } @else {\n @if $extra == null {\n $extra: $transform;\n } @else {\n $extra: $extra $transform;\n }\n }\n }\n\n @if $x == '0' or $x == null {\n @include multi-dir() {\n transform: $ltr-translate $extra;\n }\n } @else {\n @include ltr() {\n transform: $ltr-translate $extra;\n }\n\n @include rtl() {\n transform: $rtl-translate $extra;\n }\n }\n}\n","\n// Global Utility Functions\n@import \"./ionic.functions.string\";\n\n// Global Color Functions\n@import \"./ionic.functions.color\";\n\n// Global Font Functions\n@import \"./ionic.functions.font\";\n\n// Global Mixins\n@import \"./ionic.mixins\";\n\n// Default Theme\n@import \"./ionic.theme.default\";\n\n\n// Default General\n// --------------------------------------------------\n$font-family-base: var(--ion-font-family, inherit);\n\n// Hairlines width\n$hairlines-width: .55px;\n\n// The minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries\n$screen-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px\n);\n\n// Input placeholder opacity\n// Ensures that the placeholder has the\n// correct color contrast against the background.\n$placeholder-opacity: var(--ion-placeholder-opacity, 0.6);\n\n$form-control-label-margin: 16px;\n\n// How much the stacked labels should be scaled by\n/// The value 0.75 is used to match the MD spec.\n/// iOS does not have a floating label design spec, so we standardize on 0.75.\n$form-control-label-stacked-scale: 0.75;\n\n\n// Z-Index\n// --------------------------------------------------\n// Grouped by elements which would be siblings\n\n$z-index-menu-overlay: 1000;\n$z-index-overlay: 1001;\n\n$z-index-fixed-content: 999;\n$z-index-refresher: -1;\n\n$z-index-page-container: 0;\n$z-index-toolbar: 10;\n$z-index-toolbar-background: -1;\n$z-index-toolbar-buttons: 99;\n\n$z-index-backdrop: 2;\n$z-index-overlay-wrapper: 10;\n\n$z-index-item-options: 1;\n$z-index-item-input: 2;\n$z-index-item-divider: 100;\n\n$z-index-reorder-selected: 100;\n","@import \"../../themes/ionic.globals.ios\";\n\n// iOS Menu\n// --------------------------------------------------\n\n/// @prop - Box shadow color of the menu\n$menu-ios-box-shadow-color: rgba(0, 0, 0, .08);\n\n/// @prop - Box shadow of the menu\n$menu-ios-box-shadow: -8px 0 42px $menu-ios-box-shadow-color;\n\n/// @prop - Box shadow of the menu in rtl mode\n$menu-ios-box-shadow-rtl: 8px 0 42px $menu-ios-box-shadow-color;\n\n/// @prop - Box shadow of the reveal menu\n$menu-ios-box-shadow-reveal: $menu-ios-box-shadow;\n\n/// @prop - Box shadow of the reveal menu\n$menu-ios-box-shadow-reveal-rtl: $menu-ios-box-shadow-rtl;\n\n/// @prop - Box shadow of the push menu\n$menu-ios-box-shadow-push: null;\n\n/// @prop - Box shadow of the overlay menu\n$menu-ios-box-shadow-overlay: null;\n","@import \"../../themes/ionic.globals.md\";\n\n// Material Design Menu\n// --------------------------------------------------\n\n/// @prop - Box shadow of the menu\n$menu-md-box-shadow: 4px 0px 16px rgba(0, 0, 0, 0.18);\n","// ! normalize.css v3.0.2 \| MIT License \| github.com/necolas/normalize.css\n\n\n// HTML5 display definitions\n// ==========================================================================\n\n// 1. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\naudio,\ncanvas,\nprogress,\nvideo {\n vertical-align: baseline; // 1\n}\n\n// Prevent modern browsers from displaying `audio` without controls.\n// Remove excess height in iOS 5 devices.\naudio:not([controls]) {\n display: none;\n\n height: 0;\n}\n\n\n// Text-level semantics\n// ==========================================================================\n\n// Address style set to `bolder` in Firefox 4+, Safari, and Chrome.\nb,\nstrong {\n font-weight: bold;\n}\n\n// Embedded content\n// ==========================================================================\n\n// Makes it so the img does not flow outside container\nimg {\n max-width: 100%;\n}\n\n// Grouping content\n// ==========================================================================\n\nhr {\n height: 1px;\n\n border-width: 0;\n\n box-sizing: content-box;\n}\n\n// Contain overflow in all browsers.\npre {\n overflow: auto;\n}\n\n// Address odd `em`-unit font size rendering in all browsers.\ncode,\nkbd,\npre,\nsamp {\n font-family: monospace, monospace;\n font-size: 1em;\n}\n\n\n// Forms\n// ==========================================================================\n\n// Known limitation: by default, Chrome and Safari on OS X allow very limited\n// styling of `select`, unless a `border` property is set.\n\n// 1. Correct color not being inherited.\n// Known issue: affects color of disabled elements.\n// 2. Correct font properties not being inherited.\n// 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n//\n\nlabel,\ninput,\nselect,\ntextarea {\n font-family: inherit;\n line-height: normal;\n}\n\ntextarea {\n overflow: auto;\n\n height: auto;\n\n font: inherit;\n color: inherit;\n}\n\ntextarea::placeholder {\n padding-left: 2px;\n}\n\nform,\ninput,\noptgroup,\nselect {\n margin: 0; // 3\n\n font: inherit; // 2\n color: inherit; // 1\n}\n\n// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`\n// and `video` controls.\n// 2. Correct inability to style clickable `input` types in iOS.\n// 3. Improve usability and consistency of cursor style between image-type\n// `input` and others.\nhtml input[type=\"button\"], // 1\ninput[type=\"reset\"],\ninput[type=\"submit\"] {\n cursor: pointer; // 3\n\n -webkit-appearance: button; // 2\n}\n\n// remove 300ms delay\na,\na div,\na span,\na ion-icon,\na ion-label,\nbutton,\nbutton div,\nbutton span,\nbutton ion-icon,\nbutton ion-label,\n.ion-tappable,\n[tappable],\n[tappable] div,\n[tappable] span,\n[tappable] ion-icon,\n[tappable] ion-label,\ninput,\ntextarea {\n touch-action: manipulation;\n}\n\na ion-label,\nbutton ion-label {\n pointer-events: none;\n}\n\nbutton {\n padding: 0;\n border: 0;\n border-radius: 0;\n font-family: inherit;\n font-style: inherit;\n font-variant: inherit;\n line-height: 1;\n text-transform: none;\n cursor: pointer;\n\n -webkit-appearance: button;\n}\n\n[tappable] {\n cursor: pointer;\n}\n\n// Re-set default cursor for disabled elements.\na[disabled],\nbutton[disabled],\nhtml input[disabled] {\n cursor: default;\n}\n\n// Remove inner padding and border in Firefox 4+.\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n padding: 0;\n\n border: 0;\n}\n\n// Fix the cursor style for Chrome's increment/decrement buttons. For certain\n// `font-size` values of the `input`, it causes the cursor style of the\n// decrement button to change from `default` to `text`.\ninput[type=\"number\"]::-webkit-inner-spin-button,\ninput[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n// Remove inner padding and search cancel button in Safari and Chrome on OS X.\n// Safari (but not Chrome) clips the cancel button when the search input has\n// padding (and `textfield` appearance).\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n\n// Tables\n// ==========================================================================//\n\n// Remove most spacing between table cells.\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntd,\nth {\n padding: 0;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n\n// Structure\n// --------------------------------------------------\n// Adds structural css to the native html elements\n\n* {\n box-sizing: border-box;\n\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n -webkit-tap-highlight-color: transparent;\n -webkit-touch-callout: none;\n}\n\nhtml {\n width: 100%;\n height: 100%;\n -webkit-text-size-adjust: 100%;\n\n text-size-adjust: 100%;\n}\n\nhtml:not(.hydrated) body {\n display: none;\n}\n\nhtml.ion-ce body {\n display: block;\n}\n\nhtml.plt-pwa {\n height: 100vh;\n}\n\nbody {\n @include font-smoothing();\n @include margin(0);\n @include padding(0);\n\n position: fixed;\n\n width: 100%;\n max-width: 100%;\n height: 100%;\n max-height: 100%;\n\n /*\n Because body has position: fixed,\n * it should be promoted to its own\n * layer.\n \n WebKit does not always promote\n * the body to its own layer on page\n * load in Ionic apps. Once scrolling on\n * ion-content starts, WebKit will promote\n * body. Unfortunately, this causes a re-paint\n * which results in scrolling being halted\n * until the next user gesture.\n \n This impacts the Custom Elements build.\n * The lazy loaded build causes the browser to\n * re-paint during hydration which causes WebKit\n * to promote body to its own layer.\n * In the CE Build, this hydration does not\n * happen, so the additional re-paint does not occur.\n /\n transform: translateZ(0);\n\n text-rendering: optimizeLegibility;\n\n overflow: hidden;\n\n touch-action: manipulation;\n\n -webkit-user-drag: none;\n\n -ms-content-zooming: none;\n\n word-wrap: break-word;\n\n overscroll-behavior-y: none;\n -webkit-text-size-adjust: none;\n\n text-size-adjust: none;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Typography\n// --------------------------------------------------\n\n/// @prop - Font weight of all headings\n$headings-font-weight: 500;\n\n/// @prop - Line height of all headings\n$headings-line-height: 1.2;\n\n/// @prop - Font size of heading level 1\n$h1-font-size: dynamic-font(26px);\n\n/// @prop - Font size of heading level 2\n$h2-font-size: dynamic-font(24px);\n\n/// @prop - Font size of heading level 3\n$h3-font-size: dynamic-font(22px);\n\n/// @prop - Font size of heading level 4\n$h4-font-size: dynamic-font(20px);\n\n/// @prop - Font size of heading level 5\n$h5-font-size: dynamic-font(18px);\n\n/// @prop - Font size of heading level 6\n$h6-font-size: dynamic-font(16px);\n\nhtml {\n font-family: var(--ion-font-family);\n}\n\n/\n Dynamic Type is an iOS-only feature, so\n * this should only be enabled on iOS devices.\n /\n@supports (-webkit-touch-callout: none) {\n html {\n /\n Includes fallback if Dynamic Type is not enabled.\n /\n font: var(--ion-dynamic-font, 16px var(--ion-font-family));\n }\n}\n\na {\n background-color: transparent;\n color: ion-color(primary, base);\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n @include margin(16px, null, 10px, null);\n\n font-weight: $headings-font-weight;\n\n line-height: $headings-line-height;\n}\n\nh1 {\n @include margin(20px, null, null, null);\n\n font-size: $h1-font-size;\n}\n\nh2 {\n @include margin(18px, null, null, null);\n\n font-size: $h2-font-size;\n}\n\nh3 {\n font-size: $h3-font-size;\n}\n\nh4 {\n font-size: $h4-font-size;\n}\n\nh5 {\n font-size: $h5-font-size;\n}\n\nh6 {\n font-size: $h6-font-size;\n}\n\nsmall {\n font-size: 75%;\n}\n\nsub,\nsup {\n position: relative;\n\n font-size: 75%;\n\n line-height: 0;\n\n vertical-align: baseline;\n}\n\nsup {\n top: -.5em;\n}\n\nsub {\n bottom: -.25em;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n\n// Element Space\n// --------------------------------------------------\n// Creates padding and margin attributes to be used on\n// any element\n\n$padding: var(--ion-padding, 16px);\n$margin: var(--ion-margin, 16px);\n\n// Padding\n// --------------------------------------------------\n\n.ion-no-padding {\n --padding-start: 0;\n --padding-end: 0;\n --padding-top: 0;\n --padding-bottom: 0;\n\n @include padding(0);\n}\n\n.ion-padding {\n --padding-start: #{$padding};\n --padding-end: #{$padding};\n --padding-top: #{$padding};\n --padding-bottom: #{$padding};\n\n @include padding($padding);\n}\n\n.ion-padding-top {\n --padding-top: #{$padding};\n\n @include padding($padding, null, null, null);\n}\n\n.ion-padding-start {\n --padding-start: #{$padding};\n\n @include padding-horizontal($padding, null);\n}\n\n.ion-padding-end {\n --padding-end: #{$padding};\n\n @include padding-horizontal(null, $padding);\n}\n\n.ion-padding-bottom {\n --padding-bottom: #{$padding};\n\n @include padding(null, null, $padding, null);\n}\n\n.ion-padding-vertical {\n --padding-top: #{$padding};\n --padding-bottom: #{$padding};\n\n @include padding($padding, null, $padding, null);\n}\n\n.ion-padding-horizontal {\n --padding-start: #{$padding};\n --padding-end: #{$padding};\n\n @include padding-horizontal($padding);\n}\n\n\n// Margin\n// --------------------------------------------------\n\n.ion-no-margin {\n --margin-start: 0;\n --margin-end: 0;\n --margin-top: 0;\n --margin-bottom: 0;\n\n @include margin(0);\n}\n\n.ion-margin {\n --margin-start: #{$margin};\n --margin-end: #{$margin};\n --margin-top: #{$margin};\n --margin-bottom: #{$margin};\n\n @include margin($margin);\n}\n\n.ion-margin-top {\n --margin-top: #{$margin};\n\n @include margin($margin, null, null, null);\n}\n\n.ion-margin-start {\n --margin-start: #{$margin};\n\n @include margin-horizontal($margin, null);\n}\n\n.ion-margin-end {\n --margin-end: #{$margin};\n\n @include margin-horizontal(null, $margin);\n}\n\n.ion-margin-bottom {\n --margin-bottom: #{$margin};\n\n @include margin(null, null, $margin, null);\n}\n\n.ion-margin-vertical {\n --margin-top: #{$margin};\n --margin-bottom: #{$margin};\n\n @include margin($margin, null, $margin, null);\n}\n\n.ion-margin-horizontal {\n --margin-start: #{$margin};\n --margin-end: #{$margin};\n\n @include margin-horizontal($margin);\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Float Elements\n// --------------------------------------------------\n// Creates float classes based on screen size\n\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `.ion-float-{bp}-{side}` classes for floating the element based\n // on the breakpoint and side\n .ion-float#{$infix}-left {\n @include float(left, !important);\n }\n\n .ion-float#{$infix}-right {\n @include float(right, !important);\n }\n\n .ion-float#{$infix}-start {\n @include float(start, !important);\n }\n\n .ion-float#{$infix}-end {\n @include float(end, !important);\n }\n }\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Text Alignment\n// --------------------------------------------------\n// Creates text alignment attributes based on screen size\n\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `.ion-text-{bp}` classes for aligning the text based\n // on the breakpoint\n .ion-text#{$infix}-center {\n text-align: center !important;\n }\n\n .ion-text#{$infix}-justify {\n text-align: justify !important;\n }\n\n .ion-text#{$infix}-start {\n text-align: start !important;\n }\n\n .ion-text#{$infix}-end {\n text-align: end !important;\n }\n\n .ion-text#{$infix}-left {\n text-align: left !important;\n }\n\n .ion-text#{$infix}-right {\n text-align: right !important;\n }\n\n .ion-text#{$infix}-nowrap {\n white-space: nowrap !important;\n }\n\n .ion-text#{$infix}-wrap {\n white-space: normal !important;\n }\n }\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Text Transformation\n// --------------------------------------------------\n// Creates text transform attributes based on screen size\n\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `.ion-text-{bp}` classes for transforming the text based\n // on the breakpoint\n .ion-text#{$infix}-uppercase {\n / stylelint-disable-next-line declaration-no-important /\n text-transform: uppercase !important;\n }\n\n .ion-text#{$infix}-lowercase {\n / stylelint-disable-next-line declaration-no-important /\n text-transform: lowercase !important;\n }\n\n .ion-text#{$infix}-capitalize {\n / stylelint-disable-next-line declaration-no-important */\n text-transform: capitalize !important;\n }\n }\n}\n","// Flex Utilities\n// --------------------------------------------------\n// Creates flex classes to align flex containers\n// and items\n\n// Align Self\n// --------------------------------------------------\n\n.ion-align-self-start {\n align-self: flex-start !important;\n}\n\n.ion-align-self-end {\n align-self: flex-end !important;\n}\n\n.ion-align-self-center {\n align-self: center !important;\n}\n\n.ion-align-self-stretch {\n align-self: stretch !important;\n}\n\n.ion-align-self-baseline {\n align-self: baseline !important;\n}\n\n.ion-align-self-auto {\n align-self: auto !important;\n}\n\n\n// Flex Wrap\n// --------------------------------------------------\n\n.ion-wrap {\n flex-wrap: wrap !important;\n}\n\n.ion-nowrap {\n flex-wrap: nowrap !important;\n}\n\n.ion-wrap-reverse {\n flex-wrap: wrap-reverse !important;\n}\n\n\n// Justify Content\n// --------------------------------------------------\n\n.ion-justify-content-start {\n justify-content: flex-start !important;\n}\n\n.ion-justify-content-center {\n justify-content: center !important;\n}\n\n.ion-justify-content-end {\n justify-content: flex-end !important;\n}\n\n.ion-justify-content-around {\n justify-content: space-around !important;\n}\n\n.ion-justify-content-between {\n justify-content: space-between !important;\n}\n\n.ion-justify-content-evenly {\n justify-content: space-evenly !important;\n}\n\n\n// Align Items\n// --------------------------------------------------\n\n.ion-align-items-start {\n align-items: flex-start !important;\n}\n\n.ion-align-items-center {\n align-items: center !important;\n}\n\n.ion-align-items-end {\n align-items: flex-end !important;\n}\n\n.ion-align-items-stretch {\n align-items: stretch !important;\n}\n\n.ion-align-items-baseline {\n align-items: baseline !important;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Display\n// --------------------------------------------------\n// Modifies display of a particular element based on the given classes\n\n.ion-hide {\n display: none !important;\n}\n\n// Adds hidden classes\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `ion-hide-{bp}-up` classes for hiding the element based\n // on the breakpoint\n .ion-hide#{$infix}-up {\n display: none !important;\n }\n }\n\n @include media-breakpoint-down($breakpoint, $screen-breakpoints) {\n // Provide `ion-hide-{bp}-down` classes for hiding the element based\n // on the breakpoint\n .ion-hide#{$infix}-down {\n display: none !important;\n }\n }\n}\n"]}
1	+ {"version":3,"sourceRoot":"","sources":["../src/css/core.scss","../src/themes/ionic.mixins.scss","../src/themes/ionic.globals.scss","../src/components/menu/menu.ios.vars.scss","../src/components/menu/menu.md.vars.scss","../src/css/normalize.scss","../src/css/structure.scss","../src/css/typography.scss","../src/css/padding.scss","../src/css/float-elements.scss","../src/css/text-alignment.scss","../src/css/text-transformation.scss","../src/css/flex-utils.scss","../src/css/display.scss"],"names":[],"mappings":"AAKA,MAOI,6BACA,oCACA,mCACA,gDACA,mCACA,kCALA,+BACA,sCACA,qCACA,kDACA,qCACA,oCALA,8BACA,sCACA,oCACA,iDACA,oCACA,mCALA,6BACA,qCACA,mCACA,0CACA,mCACA,kCALA,6BACA,qCACA,mCACA,0CACA,mCACA,kCALA,4BACA,mCACA,kCACA,+CACA,kCACA,iCALA,2BACA,qCACA,iCACA,wCACA,iCACA,gCALA,4BACA,qCACA,kCACA,+CACA,kCACA,iCALA,0BACA,iCACA,gCACA,6CACA,gCACA,+BAOJ,SACE,8FAEF,QACE,2DAGF,KACE,uCACA,2CAGF,KACE,uCACA,4BAGF,wBACE,gBAYF,+LAGE,gBAQF,qIAEE,mBAQF,+BACE,qDACA,mDAOF,qCACE,4CACE,0BA+BJ,2DACE,sBACA,mBAaF,wCACE,4CAyBA,mBATA,+DACA,0EACA,yEACA,0FACA,sEACA,oEAIA,qBATA,iEACA,4EACA,2EACA,4FACA,wEACA,sEAIA,oBATA,gEACA,4EACA,0EACA,2FACA,uEACA,qEAIA,mBATA,+DACA,2EACA,yEACA,oFACA,sEACA,oEAIA,mBATA,+DACA,2EACA,yEACA,oFACA,sEACA,oEAIA,kBATA,8DACA,yEACA,wEACA,yFACA,qEACA,mEAIA,iBATA,6DACA,2EACA,uEACA,kFACA,oEACA,kEAIA,kBATA,8DACA,2EACA,wEACA,yFACA,qEACA,mEAIA,gBATA,4DACA,uEACA,sEACA,uFACA,mEACA,iEAaF,UCsOM,KDrOuB,ECsOvB,MDtOiB,EC0PrB,ID1PkB,EC2PlB,OD3PwB,EAExB,aACA,kBAEA,sBACA,8BAEA,0BACA,QExH+B,EFmIjC,oBACE,kBAEA,qBAEA,YAGF,8CACE,kBAGF,iRAeE,wBAGF,oBACE,UAGF,wCACE,cAOF,6CACE,8BAGF,6BACE,KACE,mDAIJ,iDACE,KACE,8CACA,oDACA,gDACA,mDAQJ,mFAEE,cAOF,cC8TM,iCD1TN,mBACE,eACA,0BAUA,oBAMA,kBAUF,+BACE,mBAGF,4CACE,gBAGF,0BACE,WGtS+B,4BHySjC,mCACE,WGvS+B,2BH8SjC,yBACE,WIrT8B,6BJwThC,uBACE,WIzT8B,6BJ6ThC,6EACE,2BACA,4BAEF,4EACE,8BACA,+BAEF,qEACE,oBAGF,0EACE,2DAGF,uCACE,yCAEE,4BASJ,qJAEE,yBAGF,2GACE,oBACA,0BAGF,uMAEE,aAMF,6CACE,iBASF,6BACE,qBACA,sBAUF,wDACE,YACA,iBAUF,uNAOE,aAaF,oCACE,gBAUF,4CACE,kBACE,iBK7aJ,4BAIE,wBAKF,sBACE,aAEA,SAQF,SAEE,iBAOF,IACE,eAMF,GACE,WAEA,eAEA,uBAIF,IACE,cAIF,kBAIE,gCACA,cAgBF,4BAIE,oBACA,mBAGF,SACE,cAEA,YAEA,aACA,cAGF,sBACE,iBAGF,2BAIE,SAEA,aACA,cAQF,6DAGE,eAEA,0BAIF,qNAkBE,0BAGF,6BAEE,oBAGF,OACE,UACA,SACA,gBACA,oBACA,mBACA,qBACA,cACA,oBACA,eAEA,0BAGF,WACE,eAIF,kDAGE,eAIF,iDAEE,UAEA,SAMF,4FAEE,YAMF,+FAEE,wBAQF,MACE,yBACA,iBAGF,MAEE,UC1MF,EACE,sBAEA,0CACA,wCACA,2BAGF,KACE,WACA,YACA,8BAEA,sBAGF,yBACE,aAGF,iBACE,cAGF,aACE,aAGF,KL0EE,kCACA,mCA0NE,YKnSc,ELoSd,aKpSc,ELwThB,WKxTgB,ELyThB,cKzTgB,ELmSd,aKlSe,ELmSf,cKnSe,ELuTjB,YKvTiB,ELwTjB,eKxTiB,EAEjB,eAEA,WACA,eACA,YACA,gBAsBA,wBAEA,kCAEA,gBAEA,0BAEA,uBAEA,yBAEA,qBAEA,2BACA,8BAEA,sBCvDF,KACE,mCAOF,uCACE,KAIE,2DAIJ,EACE,6BACA,wCAGF,kBN0SE,WMpSgB,KNqShB,cMrS4B,KAE5B,YArD6B,IAuD7B,YApD6B,IAuD/B,GN6RE,WM5RgB,KAEhB,UAvD6B,SA0D/B,GNuRE,WMtRgB,KAEhB,UA1D6B,OA6D/B,GACE,UA3D6B,SA8D/B,GACE,UA5D6B,QA+D/B,GACE,UA7D6B,SAgE/B,GACE,UA9D6B,KAiE/B,MACE,cAGF,QAEE,kBAEA,cAEA,cAEA,wBAGF,IACE,WAGF,IACE,eClGF,gBACE,mBACA,iBACA,iBACA,oBPsTE,aOpTe,EPqTf,cOrTe,EPyUjB,YOzUiB,EP0UjB,eO1UiB,EAGnB,aACE,0CACA,wCACA,wCACA,2CPiTE,sBOpUM,yBPqUN,qBOrUM,yBPsUN,oBOtUM,yBPuUN,mBOvUM,yBPqVR,YOrVQ,yBPsVR,eOtVQ,yBAwBV,iBACE,wCP4TA,YOrVQ,yBA8BV,mBACE,0CPqSE,sBOpUM,yBPqUN,qBOrUM,yBAoCV,iBACE,wCPiSE,oBOtUM,yBPuUN,mBOvUM,yBA0CV,oBACE,2CP2SA,eOtVQ,yBAgDV,sBACE,wCACA,2CPmSA,YOrVQ,yBPsVR,eOtVQ,yBAuDV,wBACE,0CACA,wCP2QE,sBOpUM,yBPqUN,qBOrUM,yBPsUN,oBOtUM,yBPuUN,mBOvUM,yBAkEV,eACE,kBACA,gBACA,gBACA,mBP0PE,YOxPc,EPyPd,aOzPc,EP6QhB,WO7QgB,EP8QhB,cO9QgB,EAGlB,YACE,wCACA,sCACA,sCACA,yCPqPE,qBOnUK,wBPoUL,oBOpUK,wBPqUL,mBOrUK,wBPsUL,kBOtUK,wBPoVP,WOpVO,wBPqVP,cOrVO,wBAmFT,gBACE,sCPgQA,WOpVO,wBAyFT,kBACE,wCPyOE,qBOnUK,wBPoUL,oBOpUK,wBA+FT,gBACE,sCPqOE,mBOrUK,wBPsUL,kBOtUK,wBAqGT,mBACE,yCP+OA,cOrVO,wBA2GT,qBACE,sCACA,yCPuOA,WOpVO,wBPqVP,cOrVO,wBAkHT,uBACE,wCACA,sCP+ME,qBOnUK,wBPoUL,oBOpUK,wBPqUL,mBOrUK,wBPsUL,kBOtUK,wBCGL,gBR2dE,sBQvdF,iBRudE,uBQndF,iBRqcE,sBAzNO,0CA4NP,uBArNO,2BAqNP,uBA/MJ,8BAcW,0BAiMP,wBQpcF,eRwcE,uBAhOO,wCAmOP,sBA5NO,yBA4NP,sBAtNJ,8BAcW,wBAwMP,uBAnUF,yBQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBAnUF,yBQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBAnUF,yBQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBAnUF,0BQpJA,mBR2dE,sBQvdF,oBRudE,uBQndF,oBRqcE,sBAzNO,6CA4NP,uBArNO,8BAqNP,uBA/MJ,8BAcW,6BAiMP,wBQpcF,kBRwcE,uBAhOO,2CAmOP,sBA5NO,4BA4NP,sBAtNJ,8BAcW,2BAwMP,wBSvdF,iBACE,6BAGF,kBACE,8BAGF,gBACE,4BAGF,cACE,0BAGF,eACE,2BAGF,gBACE,4BAGF,iBACE,8BAGF,eACE,8BTuHF,yBSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BTuHF,yBSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BTuHF,yBSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BTuHF,0BSpJA,oBACE,6BAGF,qBACE,8BAGF,mBACE,4BAGF,iBACE,0BAGF,kBACE,2BAGF,mBACE,4BAGF,oBACE,8BAGF,kBACE,+BC7BF,oBAEE,oCAGF,oBAEE,oCAGF,qBAEE,qCVwIF,yBUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCVwIF,yBUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCVwIF,yBUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCVwIF,0BUpJA,uBAEE,oCAGF,uBAEE,oCAGF,wBAEE,sCCjBN,sBACE,iCAGF,oBACE,+BAGF,uBACE,6BAGF,wBACE,8BAGF,yBACE,+BAGF,qBACE,2BAOF,UACE,0BAGF,YACE,4BAGF,kBACE,kCAOF,2BACE,sCAGF,4BACE,kCAGF,yBACE,oCAGF,4BACE,wCAGF,6BACE,yCAGF,4BACE,wCAOF,uBACE,kCAGF,wBACE,8BAGF,qBACE,gCAGF,yBACE,+BAGF,0BACE,gCC1FF,UACE,wBAUE,aACE,wBAOF,eACE,wBZsIF,yBY/IA,gBACE,yBZuLF,4BYhLA,kBACE,yBZsIF,yBY/IA,gBACE,yBZuLF,4BYhLA,kBACE,yBZsIF,yBY/IA,gBACE,yBZuLF,4BYhLA,kBACE,yBZsIF,0BY/IA,gBACE,yBZuLF,6BYhLA,kBACE","file":"ionic.bundle.css","sourcesContent":["@use \"sass:map\";\n@import \"../themes/ionic.globals\";\n@import \"../components/menu/menu.ios.vars\";\n@import \"../components/menu/menu.md.vars\";\n\n:root {\n /*\n Loop through each color object from the\n * `ionic.theme.default.scss` file\n * and generate CSS Variables for each color.\n /\n @each $color-name, $value in $colors {\n --ion-color-#{$color-name}: #{map.get($value, base)};\n --ion-color-#{$color-name}-rgb: #{color-to-rgb-list(map.get($value, base))};\n --ion-color-#{$color-name}-contrast: #{map.get($value, contrast)};\n --ion-color-#{$color-name}-contrast-rgb: #{color-to-rgb-list(map.get($value, contrast))};\n --ion-color-#{$color-name}-shade: #{map.get($value, shade)};\n --ion-color-#{$color-name}-tint: #{map.get($value, tint)};\n }\n}\n\n// Ionic Font Family\n// --------------------------------------------------\n\nhtml.ios {\n --ion-default-font: -apple-system, BlinkMacSystemFont, \"Helvetica Neue\", \"Roboto\", sans-serif;\n}\nhtml.md {\n --ion-default-font: \"Roboto\", \"Helvetica Neue\", sans-serif;\n}\n\nhtml {\n --ion-dynamic-font: -apple-system-body;\n --ion-font-family: var(--ion-default-font);\n}\n\nbody {\n background: var(--ion-background-color);\n color: var(--ion-text-color);\n}\n\nbody.backdrop-no-scroll {\n overflow: hidden;\n}\n\n// Modal - Card Style\n// --------------------------------------------------\n/\n Card style modal needs additional padding on the\n * top of the header. We accomplish this by targeting\n * the first toolbar in the header.\n * Footer also needs this. We do not adjust the bottom\n * padding though because of the safe area.\n /\nhtml.ios ion-modal.modal-card ion-header ion-toolbar:first-of-type,\nhtml.ios ion-modal.modal-sheet ion-header ion-toolbar:first-of-type,\nhtml.ios ion-modal ion-footer ion-toolbar:first-of-type {\n padding-top: 6px;\n}\n\n/\n Card style modal needs additional padding on the\n* bottom of the header. We accomplish this by targeting\n* the last toolbar in the header.\n/\nhtml.ios ion-modal.modal-card ion-header ion-toolbar:last-of-type,\nhtml.ios ion-modal.modal-sheet ion-header ion-toolbar:last-of-type {\n padding-bottom: 6px;\n}\n\n/\n Add padding on the left and right\n* of toolbars while accounting for\n* safe area values when in landscape.\n/\nhtml.ios ion-modal ion-toolbar {\n padding-right: calc(var(--ion-safe-area-right) + 8px);\n padding-left: calc(var(--ion-safe-area-left) + 8px);\n}\n\n/\n Card style modal on iPadOS\n * should only have backdrop on first instance.\n /\n@media screen and (min-width: 768px) {\n html.ios ion-modal.modal-card:first-of-type {\n --backdrop-opacity: 0.18;\n }\n}\n\n/\n Subsequent modals should not have a backdrop/box shadow\n * as it will cause the screen to appear to get progressively\n * darker. With Ionic 6, declarative modals made it\n * possible to have multiple non-presented modals in the DOM,\n * so we could no longer rely on ion-modal:first-of-type.\n * Here we disable the opacity/box-shadow for every modal\n * that comes after the first presented modal.\n \n Note: ion-modal:not(.overlay-hidden):first-of-type\n * does not match the first modal to not have\n * the .overlay-hidden class, it will match the\n * first modal in general only if it does not\n * have the .overlay-hidden class.\n * The :nth-child() pseudo-class has support\n * for selectors which would help us here. At the\n * time of writing it does not have great cross browser\n * support.\n \n Note 2: This should only apply to non-card and\n * non-sheet modals. Card and sheet modals have their\n * own criteria for displaying backdrops/box shadows.\n \n Do not use :not(.overlay-hidden) in place of\n * .show-modal because that triggers a memory\n * leak in Blink: https://bugs.chromium.org/p/chromium/issues/detail?id=1418768\n /\nion-modal.modal-default.show-modal ~ ion-modal.modal-default {\n --backdrop-opacity: 0;\n --box-shadow: none;\n}\n\n/\n This works around a bug in WebKit where the\n * content will overflow outside of the bottom border\n * radius when re-painting. As long as a single\n * border radius value is set on .ion-page, this\n * issue does not happen. We set the top left radius\n * here because the top left corner will always have a\n * radius no matter the platform.\n * This behavior only applies to card modals.\n /\nhtml.ios ion-modal.modal-card .ion-page {\n border-top-left-radius: var(--border-radius);\n}\n\n// Ionic Colors\n// --------------------------------------------------\n// Generates the color classes and variables based on the\n// colors map\n\n@mixin generate-color($color-name) {\n $value: map-get($colors, $color-name);\n\n $base: map-get($value, base);\n $contrast: map-get($value, contrast);\n $shade: map-get($value, shade);\n $tint: map-get($value, tint);\n\n --ion-color-base: var(--ion-color-#{$color-name}, #{$base}) !important;\n --ion-color-base-rgb: var(--ion-color-#{$color-name}-rgb, #{color-to-rgb-list($base)}) !important;\n --ion-color-contrast: var(--ion-color-#{$color-name}-contrast, #{$contrast}) !important;\n --ion-color-contrast-rgb: var(--ion-color-#{$color-name}-contrast-rgb, #{color-to-rgb-list($contrast)}) !important;\n --ion-color-shade: var(--ion-color-#{$color-name}-shade, #{$shade}) !important;\n --ion-color-tint: var(--ion-color-#{$color-name}-tint, #{$tint}) !important;\n}\n\n@each $color-name, $value in $colors {\n .ion-color-#{$color-name} {\n @include generate-color($color-name);\n }\n}\n\n\n// Page Container Structure\n// --------------------------------------------------\n\n.ion-page {\n @include position(0, 0, 0, 0);\n\n display: flex;\n position: absolute;\n\n flex-direction: column;\n justify-content: space-between;\n\n contain: layout size style;\n z-index: $z-index-page-container;\n}\n\n/\n When making custom dialogs, using\n * ion-content is not required. As a result,\n * some developers may wish to have dialogs\n * that are automatically sized by the browser.\n * These changes allow certain dimension values\n * such as fit-content to work correctly.\n /\nion-modal > .ion-page {\n position: relative;\n\n contain: layout style;\n\n height: 100%;\n}\n\n.split-pane-visible > .ion-page.split-pane-main {\n position: relative;\n}\n\nion-route,\nion-route-redirect,\nion-router,\nion-select-option,\nion-nav-controller,\nion-menu-controller,\nion-action-sheet-controller,\nion-alert-controller,\nion-loading-controller,\nion-modal-controller,\nion-picker-controller,\nion-popover-controller,\nion-toast-controller,\n.ion-page-hidden {\n / stylelint-disable-next-line declaration-no-important /\n display: none !important;\n}\n\n.ion-page-invisible {\n opacity: 0;\n}\n\n.can-go-back > ion-header ion-back-button {\n display: block;\n}\n\n\n// Ionic Safe Margins\n// --------------------------------------------------\n\nhtml.plt-ios.plt-hybrid, html.plt-ios.plt-pwa {\n --ion-statusbar-padding: 20px;\n}\n\n@supports (padding-top: 20px) {\n html {\n --ion-safe-area-top: var(--ion-statusbar-padding);\n }\n}\n\n@supports (padding-top: env(safe-area-inset-top)) {\n html {\n --ion-safe-area-top: env(safe-area-inset-top);\n --ion-safe-area-bottom: env(safe-area-inset-bottom);\n --ion-safe-area-left: env(safe-area-inset-left);\n --ion-safe-area-right: env(safe-area-inset-right);\n }\n}\n\n\n// Global Card Styles\n// --------------------------------------------------\n\nion-card.ion-color .ion-inherit-color,\nion-card-header.ion-color .ion-inherit-color {\n color: inherit;\n}\n\n\n// Menu Styles\n// --------------------------------------------------\n\n.menu-content {\n @include transform(translate3d(0, 0, 0));\n}\n\n.menu-content-open {\n cursor: pointer;\n touch-action: manipulation;\n\n /\n The containing element itself should be clickable but\n * everything inside of it should not clickable when menu is open\n \n Setting pointer-events after scrolling has already started\n * will not cancel scrolling which is why we also set\n * overflow-y below.\n /\n pointer-events: none;\n\n /\n This accounts for scenarios where the main content itself\n * is scrollable.\n /\n overflow-y: hidden;\n}\n\n/\n Setting overflow cancels any in-progress scrolling\n * when the menu opens. This prevents users from accidentally\n * scrolling the main content while also dragging the menu open.\n * The code below accounts for both ion-content and then custom\n * scroll containers within ion-content (such as virtual scroll)\n /\n.menu-content-open ion-content {\n --overflow: hidden;\n}\n\n.menu-content-open .ion-content-scroll-host {\n overflow: hidden;\n}\n\n.ios .menu-content-reveal {\n box-shadow: $menu-ios-box-shadow-reveal;\n}\n\n[dir=rtl].ios .menu-content-reveal {\n box-shadow: $menu-ios-box-shadow-reveal-rtl;\n}\n\n.ios .menu-content-push {\n box-shadow: $menu-ios-box-shadow-push;\n}\n\n.md .menu-content-reveal {\n box-shadow: $menu-md-box-shadow;\n}\n\n.md .menu-content-push {\n box-shadow: $menu-md-box-shadow;\n}\n\n// Accordion Styles\nion-accordion-group.accordion-group-expand-inset > ion-accordion:first-of-type {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n}\nion-accordion-group.accordion-group-expand-inset > ion-accordion:last-of-type {\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n}\nion-accordion-group > ion-accordion:last-of-type ion-item[slot=\"header\"] {\n --border-width: 0px;\n}\n\nion-accordion.accordion-animated > [slot=\"header\"] .ion-accordion-toggle-icon {\n transition: 300ms transform cubic-bezier(0.25, 0.8, 0.5, 1);\n}\n\n@media (prefers-reduced-motion: reduce) {\n ion-accordion .ion-accordion-toggle-icon {\n / stylelint-disable declaration-no-important /\n transition: none !important;\n }\n}\n/\n The > [slot=\"header\"] selector ensures that we do\n * not modify toggle icons for any nested accordions. The state\n * of one accordion should not affect any accordions inside\n * of a nested accordion group.\n /\nion-accordion.accordion-expanding > [slot=\"header\"] .ion-accordion-toggle-icon,\nion-accordion.accordion-expanded > [slot=\"header\"] .ion-accordion-toggle-icon {\n transform: rotate(180deg);\n}\n\nion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-previous ion-item[slot=\"header\"] {\n --border-width: 0px;\n --inner-border-width: 0px;\n}\n\nion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-expanding:first-of-type,\nion-accordion-group.accordion-group-expand-inset.md > ion-accordion.accordion-expanded:first-of-type {\n margin-top: 0;\n}\n\n// Safari/iOS 15 changes the appearance of input[type=\"date\"].\n// For backwards compatibility from Ionic 5/Safari 14 designs,\n// we override the appearance only when using within an ion-input.\nion-input input::-webkit-date-and-time-value {\n text-align: start;\n}\n\n/\n The .ion-datetime-button-overlay class contains\n * styles that allow any modal/popover to be\n * sized according to the dimensions of the datetime\n * when used with ion-datetime-button.\n /\n.ion-datetime-button-overlay {\n --width: fit-content;\n --height: fit-content;\n}\n\n/\n The grid variant can scale down when inline.\n * When used in a `fit-content` overlay, this causes\n * the overlay to shrink when the month/year picker is open.\n * Explicitly setting the dimensions lets us have a consistently\n * sized grid interface.\n /\n.ion-datetime-button-overlay ion-datetime.datetime-grid {\n width: 320px;\n min-height: 320px;\n}\n\n/\n When moving focus on page transitions we call .focus() on an element which can\n * add an undesired outline ring. This CSS removes the outline ring.\n * We also remove the outline ring from elements that are actively being focused\n * by the focus manager. We are intentionally selective about which elements this\n * applies to so we do not accidentally override outlines set by the developer.\n /\n[ion-last-focus],\nheader[tabindex=\"-1\"]:focus,\n[role=\"banner\"][tabindex=\"-1\"]:focus,\nmain[tabindex=\"-1\"]:focus,\n[role=\"main\"][tabindex=\"-1\"]:focus,\nh1[tabindex=\"-1\"]:focus,\n[role=\"heading\"][aria-level=\"1\"][tabindex=\"-1\"]:focus {\n outline: none;\n}\n\n/\n * If a popover has a child ion-content (or class equivalent) then the .popover-viewport element\n * should not be scrollable to ensure the inner content does scroll. However, if the popover\n * does not have a child ion-content (or class equivalent) then the .popover-viewport element\n * should remain scrollable. This code exists globally because popover targets\n * .popover-viewport using ::slotted which only supports simple selectors.\n \n Note that we do not need to account for .ion-content-scroll-host here because that\n * class should always be placed within ion-content even if ion-content is not scrollable.\n /\n.popover-viewport:has(> ion-content) {\n overflow: hidden;\n}\n\n/\n :has has cross-browser support, but it is still relatively new. As a result,\n * we should fallback to the old behavior for environments that do not support :has.\n * Developers can explicitly enable this behavior by setting overflow: visible\n * on .popover-viewport if they know they are not going to use an ion-content.\n * TODO FW-6106 Remove this\n /\n@supports not selector(:has(> ion-content)) {\n .popover-viewport {\n overflow: hidden;\n }\n}\n","\n/\n A heuristic that applies CSS to tablet\n * viewports.\n \n Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n /\n@mixin tablet-viewport() {\n @media screen and (min-width: 768px) {\n @content;\n }\n}\n\n/\n A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n \n Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n /\n@mixin mobile-viewport() {\n @media screen and (max-width: 767px) {\n @content;\n }\n}\n\n@mixin input-cover() {\n @include position(0, null, null, 0);\n @include margin(0);\n\n position: absolute;\n\n width: 100%;\n height: 100%;\n\n border: 0;\n background: transparent;\n cursor: pointer;\n\n appearance: none;\n outline: none;\n\n &::-moz-focus-inner {\n border: 0;\n }\n}\n\n@mixin visually-hidden() {\n position: absolute;\n\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n width: 100%;\n height: 100%;\n\n margin: 0;\n padding: 0;\n\n border: 0;\n outline: 0;\n clip: rect(0 0 0 0);\n\n opacity: 0;\n overflow: hidden;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n@mixin text-inherit() {\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n letter-spacing: inherit;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n text-align: inherit;\n white-space: inherit;\n color: inherit;\n}\n\n@mixin button-state() {\n @include position(0, 0, 0, 0);\n\n position: absolute;\n\n content: \"\";\n\n opacity: 0;\n}\n\n// Font smoothing\n// --------------------------------------------------\n\n@mixin font-smoothing() {\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n}\n\n// Get the key from a map based on the index\n@function index-to-key($map, $index) {\n $keys: map-keys($map);\n\n @return nth($keys, $index);\n}\n\n\n// Breakpoint Mixins\n// ---------------------------------------------------------------------------------\n\n// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$screen-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// ---------------------------------------------------------------------------------\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $screen-breakpoints) {\n $min: map-get($breakpoints, $name);\n\n @return if($name != index-to-key($breakpoints, 1), $min, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $screen-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, \"\", \"-#{$name}\");\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $screen-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next($name, $breakpoints: $screen-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Maximum breakpoint width. Null for the smallest (first) breakpoint.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n//\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\t// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\t// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $screen-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - .02, null);\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $screen-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n\n// Text Direction - ltr / rtl\n//\n// CSS defaults to use the ltr css, and adds [dir=rtl] selectors\n// to override ltr defaults.\n// ----------------------------------------------------------\n\n@mixin multi-dir() {\n @content;\n\n // $root: #{&};\n // @at-root [dir] {\n // #{$root} {\n // @content;\n // }\n // }\n}\n\n@mixin rtl() {\n $root: #{&};\n\n $rootSplit: str-split($root, \",\");\n $selectors: #{add-root-selector($root, \"[dir=rtl]\")};\n $selectorsSplit: str-split($selectors, \",\");\n\n $hostContextSelectors: ();\n $restSelectors: ();\n $dirSelectors: ();\n\n // Selectors must be split into individual selectors in case the browser\n // doesn't support a specific selector.\n // For example, Firefox and Safari doesn't support `:host-context()`.\n // If an invalid selector is used, then the entire group of selectors\n // will be ignored.\n // @link https://www.w3.org/TR/selectors-3/#grouping\n @each $selector in $selectorsSplit {\n // Group the selectors back into a single selector to optimize the output.\n @if str-index($selector, \":host-context\") {\n $hostContextSelectors: append($hostContextSelectors, $selector, comma);\n } @else {\n // Group the selectors back into a single selector to optimize the output.\n $restSelectors: append($restSelectors, $selector, comma);\n }\n }\n\n // Supported by Chrome.\n @if length($hostContextSelectors) > 0 {\n @at-root #{$hostContextSelectors} {\n @content;\n }\n }\n\n // Supported by all browsers.\n @if length($restSelectors) > 0 {\n @at-root #{$restSelectors} {\n @content;\n }\n }\n\n // If browser can support `:dir()`, then add the `:dir()` selectors.\n @supports selector(:dir(rtl)) {\n // Adding :dir() in case the browser doesn't support `:host-context()` and does support `:dir()`.\n // `:host-context()` is added:\n // - through the `add-root-selector()` function.\n // - first so that it takes precedence over `:dir()`.\n // For example,\n // - Firefox doesn't support `:host-context()`, but does support `:dir()`.\n // - Safari doesn't support `:host-context()`, but Safari 16.4+ supports `:dir()`\n // @link https://webkit.org/blog/13966/webkit-features-in-safari-16-4/\n // -- However, there is a Webkit bug on v16 that prevents `:dir()` from working when\n // -- the app direction is changed dynamically. v17+ works fine.\n // -- @link https://bugs.webkit.org/show_bug.cgi?id=257133\n\n // Supported by Firefox.\n @at-root #{add-root-selector($root, \":dir(rtl)\", false)} {\n @content;\n }\n }\n}\n\n@mixin ltr() {\n @content;\n}\n\n\n// SVG Background Image Mixin\n// @param {string} $svg\n// ----------------------------------------------------------\n@mixin svg-background-image($svg, $flip-rtl: false) {\n $url: url-encode($svg);\n $viewBox: str-split(str-extract($svg, \"viewBox='\", \"'\"), \" \");\n\n @if $flip-rtl != true or $viewBox == null {\n @include multi-dir() {\n background-image: url(\"data:image/svg+xml;charset=utf-8,#{$url}\");\n }\n } @else {\n $transform: \"transform='translate(#{nth($viewBox, 3)}, 0) scale(-1, 1)'\";\n $flipped-url: $svg;\n $flipped-url: str-replace($flipped-url, \"<path\", \"<path #{$transform}\");\n $flipped-url: str-replace($flipped-url, \"<line\", \"<line #{$transform}\");\n $flipped-url: str-replace($flipped-url, \"<polygon\", \"<polygon #{$transform}\");\n $flipped-url: url-encode($flipped-url);\n\n @include ltr () {\n background-image: url(\"data:image/svg+xml;charset=utf-8,#{$url}\");\n }\n @include rtl() {\n background-image: url(\"data:image/svg+xml;charset=utf-8,#{$flipped-url}\");\n }\n }\n}\n\n// Add property horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin property-horizontal($prop, $start, $end: $start) {\n @if $start == 0 and $end == 0 {\n #{$prop}-left: $start;\n #{$prop}-right: $end;\n\n } @else {\n -webkit-#{$prop}-start: $start;\n #{$prop}-inline-start: $start;\n -webkit-#{$prop}-end: $end;\n #{$prop}-inline-end: $end;\n }\n}\n\n// Add property for all directions\n// @param {string} $prop\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// @param {boolean} $content include content or use default\n// ----------------------------------------------------------\n@mixin property($prop, $top, $end: $top, $bottom: $top, $start: $end) {\n @include property-horizontal($prop, $start, $end);\n #{$prop}-top: $top;\n #{$prop}-bottom: $bottom;\n}\n\n// Add padding horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin padding-horizontal($start, $end: $start) {\n @include property-horizontal(padding, $start, $end);\n}\n\n// Add padding for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin padding($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(padding, $top, $end, $bottom, $start);\n}\n\n// Add margin horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin margin-horizontal($start, $end: $start) {\n @include property-horizontal(margin, $start, $end);\n}\n\n// Add margin for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin margin($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(margin, $top, $end, $bottom, $start);\n}\n\n// Add position horizontal\n// @param {string} $start - amount to position start\n// @param {string} $end - amount to left: 0; end\n// ----------------------------------------------------------\n@mixin position-horizontal($start: null, $end: null) {\n @if $start == $end {\n @include multi-dir() {\n left: $start;\n right: $end;\n }\n } @else {\n @at-root {\n & {\n inset-inline-start: $start;\n inset-inline-end: $end;\n }\n }\n }\n}\n\n// Add position for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin position($top: null, $end: null, $bottom: null, $start: null) {\n @include position-horizontal($start, $end);\n top: $top;\n bottom: $bottom;\n}\n\n// Add border for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin border($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(border, $top, $end, $bottom, $start);\n}\n\n// Add border radius for all directions\n// @param {string} $top-start\n// @param {string} $top-end\n// @param {string} $bottom-end\n// @param {string} $bottom-start\n// ----------------------------------------------------------\n@mixin border-radius($top-start, $top-end: $top-start, $bottom-end: $top-start, $bottom-start: $top-end) {\n @if $top-start == $top-end and $top-start == $bottom-end and $top-start == $bottom-start {\n border-radius: $top-start;\n } @else {\n border-start-start-radius: $top-start;\n border-start-end-radius: $top-end;\n border-end-end-radius: $bottom-end;\n border-end-start-radius: $bottom-start;\n }\n}\n\n// Add direction for all directions\n// @param {string} $dir - Direction on LTR\n@mixin direction($dir) {\n $other-dir: null;\n\n @if $dir == ltr {\n $other-dir: rtl;\n } @else {\n $other-dir: ltr;\n }\n\n @include ltr() {\n direction: $dir;\n }\n @include rtl() {\n direction: $other-dir;\n }\n}\n\n// Add float for all directions\n// @param {string} $side\n// @param {string} $decorator - !important\n@mixin float($side, $decorator: null) {\n @if $side == start {\n @include ltr() {\n float: left $decorator;\n }\n @include rtl() {\n float: right $decorator;\n }\n } @else if $side == end {\n @include ltr() {\n float: right $decorator;\n }\n @include rtl() {\n float: left $decorator;\n }\n } @else {\n @include multi-dir() {\n float: $side $decorator;\n }\n }\n}\n\n@mixin background-position($horizontal, $horizontal-amount: null, $vertical: null, $vertical-amount: null) {\n @if $horizontal == start or $horizontal == end {\n $horizontal-ltr: null;\n $horizontal-rtl: null;\n @if $horizontal == start {\n $horizontal-ltr: left;\n $horizontal-rtl: right;\n } @else {\n $horizontal-ltr: right;\n $horizontal-rtl: left;\n }\n\n @include ltr() {\n background-position: $horizontal-ltr $horizontal-amount $vertical $vertical-amount;\n }\n @include rtl() {\n background-position: $horizontal-rtl $horizontal-amount $vertical $vertical-amount;\n }\n } @else {\n @include multi-dir() {\n background-position: $horizontal $horizontal-amount $vertical $vertical-amount;\n }\n }\n}\n\n@mixin transform-origin($x-axis, $y-axis: null) {\n @if $x-axis == start {\n @include ltr() {\n transform-origin: left $y-axis;\n }\n @include rtl() {\n transform-origin: right $y-axis;\n }\n } @else if $x-axis == end {\n @include ltr() {\n transform-origin: right $y-axis;\n }\n @include rtl() {\n transform-origin: left $y-axis;\n }\n } @else if $x-axis == left or $x-axis == right {\n @include multi-dir() {\n transform-origin: $x-axis $y-axis;\n }\n } @else {\n @include ltr() {\n transform-origin: $x-axis $y-axis;\n }\n @include rtl() {\n transform-origin: calc(100% - #{$x-axis}) $y-axis;\n }\n }\n}\n\n// Add transform for all directions\n// @param {string} $transforms - comma separated list of transforms\n@mixin transform($transforms...) {\n $extra: null;\n\n $x: null;\n $ltr-translate: null;\n $rtl-translate: null;\n\n @each $transform in $transforms {\n @if (str-index($transform, translate3d)) {\n $transform: str-replace($transform, 'translate3d(');\n $transform: str-replace($transform, ')');\n\n $coordinates: str-split($transform, ',');\n\n $x: nth($coordinates, 1);\n $y: nth($coordinates, 2);\n $z: nth($coordinates, 3);\n\n $ltr-translate: translate3d($x, $y, $z);\n $rtl-translate: translate3d(calc(-1 #{$x}), $y, $z);\n } @else {\n @if $extra == null {\n $extra: $transform;\n } @else {\n $extra: $extra $transform;\n }\n }\n }\n\n @if $x == '0' or $x == null {\n @include multi-dir() {\n transform: $ltr-translate $extra;\n }\n } @else {\n @include ltr() {\n transform: $ltr-translate $extra;\n }\n\n @include rtl() {\n transform: $rtl-translate $extra;\n }\n }\n}\n","\n// Global Utility Functions\n@import \"./ionic.functions.string\";\n\n// Global Color Functions\n@import \"./ionic.functions.color\";\n\n// Global Font Functions\n@import \"./ionic.functions.font\";\n\n// Global Mixins\n@import \"./ionic.mixins\";\n\n// Default Theme\n@import \"./ionic.theme.default\";\n\n\n// Default General\n// --------------------------------------------------\n$font-family-base: var(--ion-font-family, inherit);\n\n// Hairlines width\n$hairlines-width: .55px;\n\n// The minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries\n$screen-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px\n);\n\n// Input placeholder opacity\n// Ensures that the placeholder has the\n// correct color contrast against the background.\n$placeholder-opacity: var(--ion-placeholder-opacity, 0.6);\n\n$form-control-label-margin: 16px;\n\n// How much the stacked labels should be scaled by\n/// The value 0.75 is used to match the MD spec.\n/// iOS does not have a floating label design spec, so we standardize on 0.75.\n$form-control-label-stacked-scale: 0.75;\n\n\n// Z-Index\n// --------------------------------------------------\n// Grouped by elements which would be siblings\n\n$z-index-menu-overlay: 1000;\n$z-index-overlay: 1001;\n\n$z-index-fixed-content: 999;\n$z-index-refresher: -1;\n\n$z-index-page-container: 0;\n$z-index-toolbar: 10;\n$z-index-toolbar-background: -1;\n$z-index-toolbar-buttons: 99;\n\n$z-index-backdrop: 2;\n$z-index-overlay-wrapper: 10;\n\n$z-index-item-options: 1;\n$z-index-item-input: 2;\n$z-index-item-divider: 100;\n\n$z-index-reorder-selected: 100;\n","@import \"../../themes/ionic.globals.ios\";\n\n// iOS Menu\n// --------------------------------------------------\n\n/// @prop - Box shadow color of the menu\n$menu-ios-box-shadow-color: rgba(0, 0, 0, .08);\n\n/// @prop - Box shadow of the menu\n$menu-ios-box-shadow: -8px 0 42px $menu-ios-box-shadow-color;\n\n/// @prop - Box shadow of the menu in rtl mode\n$menu-ios-box-shadow-rtl: 8px 0 42px $menu-ios-box-shadow-color;\n\n/// @prop - Box shadow of the reveal menu\n$menu-ios-box-shadow-reveal: $menu-ios-box-shadow;\n\n/// @prop - Box shadow of the reveal menu\n$menu-ios-box-shadow-reveal-rtl: $menu-ios-box-shadow-rtl;\n\n/// @prop - Box shadow of the push menu\n$menu-ios-box-shadow-push: null;\n\n/// @prop - Box shadow of the overlay menu\n$menu-ios-box-shadow-overlay: null;\n","@import \"../../themes/ionic.globals.md\";\n\n// Material Design Menu\n// --------------------------------------------------\n\n/// @prop - Box shadow of the menu\n$menu-md-box-shadow: 4px 0px 16px rgba(0, 0, 0, 0.18);\n","// ! normalize.css v3.0.2 \| MIT License \| github.com/necolas/normalize.css\n\n\n// HTML5 display definitions\n// ==========================================================================\n\n// 1. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\naudio,\ncanvas,\nprogress,\nvideo {\n vertical-align: baseline; // 1\n}\n\n// Prevent modern browsers from displaying `audio` without controls.\n// Remove excess height in iOS 5 devices.\naudio:not([controls]) {\n display: none;\n\n height: 0;\n}\n\n\n// Text-level semantics\n// ==========================================================================\n\n// Address style set to `bolder` in Firefox 4+, Safari, and Chrome.\nb,\nstrong {\n font-weight: bold;\n}\n\n// Embedded content\n// ==========================================================================\n\n// Makes it so the img does not flow outside container\nimg {\n max-width: 100%;\n}\n\n// Grouping content\n// ==========================================================================\n\nhr {\n height: 1px;\n\n border-width: 0;\n\n box-sizing: content-box;\n}\n\n// Contain overflow in all browsers.\npre {\n overflow: auto;\n}\n\n// Address odd `em`-unit font size rendering in all browsers.\ncode,\nkbd,\npre,\nsamp {\n font-family: monospace, monospace;\n font-size: 1em;\n}\n\n\n// Forms\n// ==========================================================================\n\n// Known limitation: by default, Chrome and Safari on OS X allow very limited\n// styling of `select`, unless a `border` property is set.\n\n// 1. Correct color not being inherited.\n// Known issue: affects color of disabled elements.\n// 2. Correct font properties not being inherited.\n// 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n//\n\nlabel,\ninput,\nselect,\ntextarea {\n font-family: inherit;\n line-height: normal;\n}\n\ntextarea {\n overflow: auto;\n\n height: auto;\n\n font: inherit;\n color: inherit;\n}\n\ntextarea::placeholder {\n padding-left: 2px;\n}\n\nform,\ninput,\noptgroup,\nselect {\n margin: 0; // 3\n\n font: inherit; // 2\n color: inherit; // 1\n}\n\n// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`\n// and `video` controls.\n// 2. Correct inability to style clickable `input` types in iOS.\n// 3. Improve usability and consistency of cursor style between image-type\n// `input` and others.\nhtml input[type=\"button\"], // 1\ninput[type=\"reset\"],\ninput[type=\"submit\"] {\n cursor: pointer; // 3\n\n -webkit-appearance: button; // 2\n}\n\n// remove 300ms delay\na,\na div,\na span,\na ion-icon,\na ion-label,\nbutton,\nbutton div,\nbutton span,\nbutton ion-icon,\nbutton ion-label,\n.ion-tappable,\n[tappable],\n[tappable] div,\n[tappable] span,\n[tappable] ion-icon,\n[tappable] ion-label,\ninput,\ntextarea {\n touch-action: manipulation;\n}\n\na ion-label,\nbutton ion-label {\n pointer-events: none;\n}\n\nbutton {\n padding: 0;\n border: 0;\n border-radius: 0;\n font-family: inherit;\n font-style: inherit;\n font-variant: inherit;\n line-height: 1;\n text-transform: none;\n cursor: pointer;\n\n -webkit-appearance: button;\n}\n\n[tappable] {\n cursor: pointer;\n}\n\n// Re-set default cursor for disabled elements.\na[disabled],\nbutton[disabled],\nhtml input[disabled] {\n cursor: default;\n}\n\n// Remove inner padding and border in Firefox 4+.\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n padding: 0;\n\n border: 0;\n}\n\n// Fix the cursor style for Chrome's increment/decrement buttons. For certain\n// `font-size` values of the `input`, it causes the cursor style of the\n// decrement button to change from `default` to `text`.\ninput[type=\"number\"]::-webkit-inner-spin-button,\ninput[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n// Remove inner padding and search cancel button in Safari and Chrome on OS X.\n// Safari (but not Chrome) clips the cancel button when the search input has\n// padding (and `textfield` appearance).\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n\n// Tables\n// ==========================================================================//\n\n// Remove most spacing between table cells.\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntd,\nth {\n padding: 0;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n\n// Structure\n// --------------------------------------------------\n// Adds structural css to the native html elements\n\n* {\n box-sizing: border-box;\n\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n -webkit-tap-highlight-color: transparent;\n -webkit-touch-callout: none;\n}\n\nhtml {\n width: 100%;\n height: 100%;\n -webkit-text-size-adjust: 100%;\n\n text-size-adjust: 100%;\n}\n\nhtml:not(.hydrated) body {\n display: none;\n}\n\nhtml.ion-ce body {\n display: block;\n}\n\nhtml.plt-pwa {\n height: 100vh;\n}\n\nbody {\n @include font-smoothing();\n @include margin(0);\n @include padding(0);\n\n position: fixed;\n\n width: 100%;\n max-width: 100%;\n height: 100%;\n max-height: 100%;\n\n /*\n Because body has position: fixed,\n * it should be promoted to its own\n * layer.\n \n WebKit does not always promote\n * the body to its own layer on page\n * load in Ionic apps. Once scrolling on\n * ion-content starts, WebKit will promote\n * body. Unfortunately, this causes a re-paint\n * which results in scrolling being halted\n * until the next user gesture.\n \n This impacts the Custom Elements build.\n * The lazy loaded build causes the browser to\n * re-paint during hydration which causes WebKit\n * to promote body to its own layer.\n * In the CE Build, this hydration does not\n * happen, so the additional re-paint does not occur.\n /\n transform: translateZ(0);\n\n text-rendering: optimizeLegibility;\n\n overflow: hidden;\n\n touch-action: manipulation;\n\n -webkit-user-drag: none;\n\n -ms-content-zooming: none;\n\n word-wrap: break-word;\n\n overscroll-behavior-y: none;\n -webkit-text-size-adjust: none;\n\n text-size-adjust: none;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Typography\n// --------------------------------------------------\n\n/// @prop - Font weight of all headings\n$headings-font-weight: 500;\n\n/// @prop - Line height of all headings\n$headings-line-height: 1.2;\n\n/// @prop - Font size of heading level 1\n$h1-font-size: dynamic-font(26px);\n\n/// @prop - Font size of heading level 2\n$h2-font-size: dynamic-font(24px);\n\n/// @prop - Font size of heading level 3\n$h3-font-size: dynamic-font(22px);\n\n/// @prop - Font size of heading level 4\n$h4-font-size: dynamic-font(20px);\n\n/// @prop - Font size of heading level 5\n$h5-font-size: dynamic-font(18px);\n\n/// @prop - Font size of heading level 6\n$h6-font-size: dynamic-font(16px);\n\nhtml {\n font-family: var(--ion-font-family);\n}\n\n/\n Dynamic Type is an iOS-only feature, so\n * this should only be enabled on iOS devices.\n /\n@supports (-webkit-touch-callout: none) {\n html {\n /\n Includes fallback if Dynamic Type is not enabled.\n /\n font: var(--ion-dynamic-font, 16px var(--ion-font-family));\n }\n}\n\na {\n background-color: transparent;\n color: ion-color(primary, base);\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n @include margin(16px, null, 10px, null);\n\n font-weight: $headings-font-weight;\n\n line-height: $headings-line-height;\n}\n\nh1 {\n @include margin(20px, null, null, null);\n\n font-size: $h1-font-size;\n}\n\nh2 {\n @include margin(18px, null, null, null);\n\n font-size: $h2-font-size;\n}\n\nh3 {\n font-size: $h3-font-size;\n}\n\nh4 {\n font-size: $h4-font-size;\n}\n\nh5 {\n font-size: $h5-font-size;\n}\n\nh6 {\n font-size: $h6-font-size;\n}\n\nsmall {\n font-size: 75%;\n}\n\nsub,\nsup {\n position: relative;\n\n font-size: 75%;\n\n line-height: 0;\n\n vertical-align: baseline;\n}\n\nsup {\n top: -.5em;\n}\n\nsub {\n bottom: -.25em;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n\n// Element Space\n// --------------------------------------------------\n// Creates padding and margin attributes to be used on\n// any element\n\n$padding: var(--ion-padding, 16px);\n$margin: var(--ion-margin, 16px);\n\n// Padding\n// --------------------------------------------------\n\n.ion-no-padding {\n --padding-start: 0;\n --padding-end: 0;\n --padding-top: 0;\n --padding-bottom: 0;\n\n @include padding(0);\n}\n\n.ion-padding {\n --padding-start: #{$padding};\n --padding-end: #{$padding};\n --padding-top: #{$padding};\n --padding-bottom: #{$padding};\n\n @include padding($padding);\n}\n\n.ion-padding-top {\n --padding-top: #{$padding};\n\n @include padding($padding, null, null, null);\n}\n\n.ion-padding-start {\n --padding-start: #{$padding};\n\n @include padding-horizontal($padding, null);\n}\n\n.ion-padding-end {\n --padding-end: #{$padding};\n\n @include padding-horizontal(null, $padding);\n}\n\n.ion-padding-bottom {\n --padding-bottom: #{$padding};\n\n @include padding(null, null, $padding, null);\n}\n\n.ion-padding-vertical {\n --padding-top: #{$padding};\n --padding-bottom: #{$padding};\n\n @include padding($padding, null, $padding, null);\n}\n\n.ion-padding-horizontal {\n --padding-start: #{$padding};\n --padding-end: #{$padding};\n\n @include padding-horizontal($padding);\n}\n\n\n// Margin\n// --------------------------------------------------\n\n.ion-no-margin {\n --margin-start: 0;\n --margin-end: 0;\n --margin-top: 0;\n --margin-bottom: 0;\n\n @include margin(0);\n}\n\n.ion-margin {\n --margin-start: #{$margin};\n --margin-end: #{$margin};\n --margin-top: #{$margin};\n --margin-bottom: #{$margin};\n\n @include margin($margin);\n}\n\n.ion-margin-top {\n --margin-top: #{$margin};\n\n @include margin($margin, null, null, null);\n}\n\n.ion-margin-start {\n --margin-start: #{$margin};\n\n @include margin-horizontal($margin, null);\n}\n\n.ion-margin-end {\n --margin-end: #{$margin};\n\n @include margin-horizontal(null, $margin);\n}\n\n.ion-margin-bottom {\n --margin-bottom: #{$margin};\n\n @include margin(null, null, $margin, null);\n}\n\n.ion-margin-vertical {\n --margin-top: #{$margin};\n --margin-bottom: #{$margin};\n\n @include margin($margin, null, $margin, null);\n}\n\n.ion-margin-horizontal {\n --margin-start: #{$margin};\n --margin-end: #{$margin};\n\n @include margin-horizontal($margin);\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Float Elements\n// --------------------------------------------------\n// Creates float classes based on screen size\n\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `.ion-float-{bp}-{side}` classes for floating the element based\n // on the breakpoint and side\n .ion-float#{$infix}-left {\n @include float(left, !important);\n }\n\n .ion-float#{$infix}-right {\n @include float(right, !important);\n }\n\n .ion-float#{$infix}-start {\n @include float(start, !important);\n }\n\n .ion-float#{$infix}-end {\n @include float(end, !important);\n }\n }\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Text Alignment\n// --------------------------------------------------\n// Creates text alignment attributes based on screen size\n\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `.ion-text-{bp}` classes for aligning the text based\n // on the breakpoint\n .ion-text#{$infix}-center {\n text-align: center !important;\n }\n\n .ion-text#{$infix}-justify {\n text-align: justify !important;\n }\n\n .ion-text#{$infix}-start {\n text-align: start !important;\n }\n\n .ion-text#{$infix}-end {\n text-align: end !important;\n }\n\n .ion-text#{$infix}-left {\n text-align: left !important;\n }\n\n .ion-text#{$infix}-right {\n text-align: right !important;\n }\n\n .ion-text#{$infix}-nowrap {\n white-space: nowrap !important;\n }\n\n .ion-text#{$infix}-wrap {\n white-space: normal !important;\n }\n }\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Text Transformation\n// --------------------------------------------------\n// Creates text transform attributes based on screen size\n\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `.ion-text-{bp}` classes for transforming the text based\n // on the breakpoint\n .ion-text#{$infix}-uppercase {\n / stylelint-disable-next-line declaration-no-important /\n text-transform: uppercase !important;\n }\n\n .ion-text#{$infix}-lowercase {\n / stylelint-disable-next-line declaration-no-important /\n text-transform: lowercase !important;\n }\n\n .ion-text#{$infix}-capitalize {\n / stylelint-disable-next-line declaration-no-important */\n text-transform: capitalize !important;\n }\n }\n}\n","// Flex Utilities\n// --------------------------------------------------\n// Creates flex classes to align flex containers\n// and items\n\n// Align Self\n// --------------------------------------------------\n\n.ion-align-self-start {\n align-self: flex-start !important;\n}\n\n.ion-align-self-end {\n align-self: flex-end !important;\n}\n\n.ion-align-self-center {\n align-self: center !important;\n}\n\n.ion-align-self-stretch {\n align-self: stretch !important;\n}\n\n.ion-align-self-baseline {\n align-self: baseline !important;\n}\n\n.ion-align-self-auto {\n align-self: auto !important;\n}\n\n\n// Flex Wrap\n// --------------------------------------------------\n\n.ion-wrap {\n flex-wrap: wrap !important;\n}\n\n.ion-nowrap {\n flex-wrap: nowrap !important;\n}\n\n.ion-wrap-reverse {\n flex-wrap: wrap-reverse !important;\n}\n\n\n// Justify Content\n// --------------------------------------------------\n\n.ion-justify-content-start {\n justify-content: flex-start !important;\n}\n\n.ion-justify-content-center {\n justify-content: center !important;\n}\n\n.ion-justify-content-end {\n justify-content: flex-end !important;\n}\n\n.ion-justify-content-around {\n justify-content: space-around !important;\n}\n\n.ion-justify-content-between {\n justify-content: space-between !important;\n}\n\n.ion-justify-content-evenly {\n justify-content: space-evenly !important;\n}\n\n\n// Align Items\n// --------------------------------------------------\n\n.ion-align-items-start {\n align-items: flex-start !important;\n}\n\n.ion-align-items-center {\n align-items: center !important;\n}\n\n.ion-align-items-end {\n align-items: flex-end !important;\n}\n\n.ion-align-items-stretch {\n align-items: stretch !important;\n}\n\n.ion-align-items-baseline {\n align-items: baseline !important;\n}\n","@import \"../themes/ionic.globals\";\n@import \"../themes/ionic.mixins\";\n\n// Display\n// --------------------------------------------------\n// Modifies display of a particular element based on the given classes\n\n.ion-hide {\n display: none !important;\n}\n\n// Adds hidden classes\n@each $breakpoint in map-keys($screen-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $screen-breakpoints);\n\n @include media-breakpoint-up($breakpoint, $screen-breakpoints) {\n // Provide `ion-hide-{bp}-up` classes for hiding the element based\n // on the breakpoint\n .ion-hide#{$infix}-up {\n display: none !important;\n }\n }\n\n @include media-breakpoint-down($breakpoint, $screen-breakpoints) {\n // Provide `ion-hide-{bp}-down` classes for hiding the element based\n // on the breakpoint\n .ion-hide#{$infix}-down {\n display: none !important;\n }\n }\n}\n"]}

package/dist/cjs/{index-6047957b.js → index-c0b7f8f4.js} RENAMED Viewed

@@ -3,7 +3,9 @@
  */
 'use strict';
-const index = require('./index-8709af32.js');
+const ionicGlobal = require('./ionic-global-35b86a09.js');
+const index$1 = require('./index-8709af32.js');
+const index = require('./index-5915f9b3.js');
 const helpers = require('./helpers-afaa9001.js');
 const LIFECYCLE_WILL_ENTER = 'ionViewWillEnter';
@@ -12,12 +14,121 @@ const LIFECYCLE_WILL_LEAVE = 'ionViewWillLeave';
 const LIFECYCLE_DID_LEAVE = 'ionViewDidLeave';
 const LIFECYCLE_WILL_UNLOAD = 'ionViewWillUnload';
-const iosTransitionAnimation = () => Promise.resolve().then(function () { return require('./ios.transition-59b0e1d9.js'); });
-const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-0cc7c831.js'); });
+/**
+ * Moves focus to a specified element. Note that we do not remove the tabindex
+ * because that can result in an unintentional blur. Non-focusables can't be
+ * focused, so the body will get focused again.
+ */
+const moveFocus = (el) => {
+    el.tabIndex = -1;
+    el.focus();
+};
+/**
+ * Elements that are hidden using `display: none` should not be focused even if
+ * they are present in the DOM.
+ */
+const isVisible = (el) => {
+    return el.offsetParent !== null;
+};
+/**
+ * The focus controller allows us to manage focus within a view so assistive
+ * technologies can inform users of changes to the navigation state. Traditional
+ * native apps have a way of informing assistive technology about a navigation
+ * state change. Mobile browsers have this too, but only when doing a full page
+ * load. In a single page app we do not do that, so we need to build this
+ * integration ourselves.
+ */
+const createFocusController = () => {
+    const saveViewFocus = (referenceEl) => {
+        const focusManagerEnabled = ionicGlobal.config.get('focusManagerPriority', false);
+        /**
+         * When going back to a previously visited page focus should typically be moved
+         * back to the element that was last focused when the user was on this view.
+         */
+        if (focusManagerEnabled) {
+            const activeEl = document.activeElement;
+            if (activeEl !== null && (referenceEl === null || referenceEl === void 0 ? void 0 : referenceEl.contains(activeEl))) {
+                activeEl.setAttribute(LAST_FOCUS, 'true');
+            }
+        }
+    };
+    const setViewFocus = (referenceEl) => {
+        const focusManagerPriorities = ionicGlobal.config.get('focusManagerPriority', false);
+        /**
+         * If the focused element is a descendant of the referenceEl then it's possible
+         * that the app developer manually moved focus, so we do not want to override that.
+         * This can happen with inputs the are focused when a view transitions in.
+         */
+        if (Array.isArray(focusManagerPriorities) && !referenceEl.contains(document.activeElement)) {
+            /**
+             * When going back to a previously visited view focus should always be moved back
+             * to the element that the user was last focused on when they were on this view.
+             */
+            const lastFocus = referenceEl.querySelector(`[${LAST_FOCUS}]`);
+            if (lastFocus && isVisible(lastFocus)) {
+                moveFocus(lastFocus);
+                return;
+            }
+            for (const priority of focusManagerPriorities) {
+                /**
+                 * For each recognized case (excluding the default case) make sure to return
+                 * so that the fallback focus behavior does not run.
+                 *
+                 * We intentionally query for specific roles/semantic elements so that the
+                 * transition manager can work with both Ionic and non-Ionic UI components.
+                 *
+                 * If new selectors are added, be sure to remove the outline ring by adding
+                 * new selectors to rule in core.scss.
+                 */
+                switch (priority) {
+                    case 'content':
+                        const content = referenceEl.querySelector('main, [role="main"]');
+                        if (content && isVisible(content)) {
+                            moveFocus(content);
+                            return;
+                        }
+                        break;
+                    case 'heading':
+                        const headingOne = referenceEl.querySelector('h1, [role="heading"][aria-level="1"]');
+                        if (headingOne && isVisible(headingOne)) {
+                            moveFocus(headingOne);
+                            return;
+                        }
+                        break;
+                    case 'banner':
+                        const header = referenceEl.querySelector('header, [role="banner"]');
+                        if (header && isVisible(header)) {
+                            moveFocus(header);
+                            return;
+                        }
+                        break;
+                    default:
+                        index.printIonWarning(`Unrecognized focus manager priority value ${priority}`);
+                        break;
+                }
+            }
+            /**
+             * If there is nothing to focus then focus the page so focus at least moves to
+             * the correct view. The browser will then determine where within the page to
+             * move focus to.
+             */
+            moveFocus(referenceEl);
+        }
+    };
+    return {
+        saveViewFocus,
+        setViewFocus,
+    };
+};
+const LAST_FOCUS = 'ion-last-focus';
+const iosTransitionAnimation = () => Promise.resolve().then(function () { return require('./ios.transition-5ddf92f1.js'); });
+const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-047c18c5.js'); });
+const focusController = createFocusController();
 // TODO(FW-2832): types
 const transition = (opts) => {
     return new Promise((resolve, reject) => {
-        index.writeTask(() => {
+        index$1.writeTask(() => {
             beforeTransition(opts);
             runTransition(opts).then((result) => {
                 if (result.animation) {
@@ -35,6 +146,7 @@ const transition = (opts) => {
 const beforeTransition = (opts) => {
     const enteringEl = opts.enteringEl;
     const leavingEl = opts.leavingEl;
+    focusController.saveViewFocus(leavingEl);
     setZIndex(enteringEl, leavingEl, opts.direction);
     if (opts.showGoBack) {
         enteringEl.classList.add('can-go-back');
@@ -57,7 +169,7 @@ const beforeTransition = (opts) => {
 };
 const runTransition = async (opts) => {
     const animationBuilder = await getAnimationBuilder(opts);
-    const ani = animationBuilder && index.Build.isBrowser ? animation(animationBuilder, opts) : noAnimation(opts); // fast path for no animation
+    const ani = animationBuilder && index$1.Build.isBrowser ? animation(animationBuilder, opts) : noAnimation(opts); // fast path for no animation
     return ani;
 };
 const afterTransition = (opts) => {
@@ -69,6 +181,7 @@ const afterTransition = (opts) => {
         leavingEl.classList.remove('ion-page-invisible');
         leavingEl.style.removeProperty('pointer-events');
     }
+    focusController.setViewFocus(enteringEl);
 };
 const getAnimationBuilder = async (opts) => {
     if (!opts.leavingEl || !opts.animated || opts.duration === 0) {
@@ -101,7 +214,12 @@ const animation = async (animationBuilder, opts) => {
 const noAnimation = async (opts) => {
     const enteringEl = opts.enteringEl;
     const leavingEl = opts.leavingEl;
-    await waitForReady(opts, false);
+    const focusManagerEnabled = ionicGlobal.config.get('focusManagerPriority', false);
+    /**
+     * If the focus manager is enabled then we need to wait for Ionic components to be
+     * rendered otherwise the component to focus may not be focused because it is hidden.
+     */
+    await waitForReady(opts, focusManagerEnabled);
     fireWillEvents(enteringEl, leavingEl);
     fireDidEvents(enteringEl, leavingEl);
     return {

package/dist/cjs/index.cjs.js CHANGED Viewed

@@ -6,9 +6,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const animation = require('./animation-b4fdf128.js');
-const index = require('./index-6047957b.js');
-const ios_transition = require('./ios.transition-59b0e1d9.js');
-const md_transition = require('./md.transition-0cc7c831.js');
+const index = require('./index-c0b7f8f4.js');
+const ios_transition = require('./ios.transition-5ddf92f1.js');
+const md_transition = require('./md.transition-047c18c5.js');
 const cubicBezier = require('./cubic-bezier-f2dccc53.js');
 const index$1 = require('./index-ee07ed59.js');
 const ionicGlobal = require('./ionic-global-35b86a09.js');
@@ -16,12 +16,12 @@ const helpers = require('./helpers-afaa9001.js');
 const config = require('./config-4f60b98a.js');
 const theme = require('./theme-d1c573d2.js');
 const index$2 = require('./index-c54654c6.js');
-const overlays = require('./overlays-2feabb85.js');
+const overlays = require('./overlays-cb04d075.js');
 require('./index-c8d52405.js');
 require('./index-8709af32.js');
+require('./index-5915f9b3.js');
 require('./gesture-controller-9436f482.js');
 require('./hardware-back-button-ed931127.js');
-require('./index-5915f9b3.js');
 require('./framework-delegate-55f5683a.js');
 const IonicSlides = (opts) => {

package/dist/cjs/ion-action-sheet.cjs.entry.js CHANGED Viewed

@@ -9,7 +9,7 @@ const index = require('./index-8709af32.js');
 const buttonActive = require('./button-active-9135c809.js');
 const helpers = require('./helpers-afaa9001.js');
 const lockController = require('./lock-controller-6585a42a.js');
-const overlays = require('./overlays-2feabb85.js');
+const overlays = require('./overlays-cb04d075.js');
 const theme = require('./theme-d1c573d2.js');
 const ionicGlobal = require('./ionic-global-35b86a09.js');
 const animation = require('./animation-b4fdf128.js');

package/dist/cjs/ion-alert.cjs.entry.js CHANGED Viewed

@@ -10,7 +10,7 @@ const config = require('./config-4f60b98a.js');
 const buttonActive = require('./button-active-9135c809.js');
 const helpers = require('./helpers-afaa9001.js');
 const lockController = require('./lock-controller-6585a42a.js');
-const overlays = require('./overlays-2feabb85.js');
+const overlays = require('./overlays-cb04d075.js');
 const theme = require('./theme-d1c573d2.js');
 const ionicGlobal = require('./ionic-global-35b86a09.js');
 const animation = require('./animation-b4fdf128.js');

package/dist/cjs/ion-app_8.cjs.entry.js CHANGED Viewed

@@ -17,7 +17,7 @@ const keyboardController = require('./keyboard-controller-c05e747a.js');
 const cubicBezier = require('./cubic-bezier-f2dccc53.js');
 const frameworkDelegate = require('./framework-delegate-55f5683a.js');
 const lockController = require('./lock-controller-6585a42a.js');
-const index$3 = require('./index-6047957b.js');
+const index$3 = require('./index-c0b7f8f4.js');
 require('./index-c8d52405.js');
 require('./keyboard-0272231f.js');
 require('./capacitor-c04564bf.js');
@@ -188,6 +188,7 @@ const Content = class {
         };
         this.color = undefined;
         this.fullscreen = false;
+        this.fixedSlotPlacement = 'after';
         this.forceOverscroll = undefined;
         this.scrollX = false;
         this.scrollY = true;
@@ -469,13 +470,13 @@ const Content = class {
         }
     }
     render() {
-        const { isMainContent, scrollX, scrollY, el } = this;
+        const { fixedSlotPlacement, isMainContent, scrollX, scrollY, el } = this;
         const rtl = dir.isRTL(el) ? 'rtl' : 'ltr';
         const mode = ionicGlobal.getIonMode(this);
         const forceOverscroll = this.shouldForceOverscroll();
         const transitionShadow = mode === 'ios';
         this.resize();
-        return (index.h(index.Host, { key: '98e9658e69c0bbe0113e4c1b89dd7b240334c039', role: isMainContent ? 'main' : undefined, class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: 'f599a7da14969df38c20a6f650179d2a319fb58b', role: isMainContent ? 'main' : undefined, class: theme.createColorClasses(this.color, {
                 [mode]: true,
                 'content-sizing': theme.hostContext('ion-popover', this.el),
                 overscroll: forceOverscroll,
@@ -483,12 +484,12 @@ const Content = class {
             }), style: {
                 '--offset-top': `${this.cTop}px`,
                 '--offset-bottom': `${this.cBottom}px`,
-            } }, index.h("div", { key: 'e89aa6ea09625846db52d63bdbf06c3c279a5ba4', ref: (el) => (this.backgroundContentEl = el), id: "background-content", part: "background" }), index.h("div", { key: '37925cf9d898ede58d5ac7b5a650c648033602a3', class: {
+            } }, index.h("div", { key: '7c545c3c95ea05abd036d0462936ac153d2a8fc6', ref: (el) => (this.backgroundContentEl = el), id: "background-content", part: "background" }), fixedSlotPlacement === 'before' ? index.h("slot", { name: "fixed" }) : null, index.h("div", { key: 'a67ab7438466c99f74b7ba59964802c3ba86ac5b', class: {
                 'inner-scroll': true,
                 'scroll-x': scrollX,
                 'scroll-y': scrollY,
                 overscroll: (scrollX || scrollY) && forceOverscroll,
-            }, ref: (scrollEl) => (this.scrollEl = scrollEl), onScroll: this.scrollEvents ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, index.h("slot", { key: 'a40f964cacf0c2e2bdcf962791aaadb386d44323' })), transitionShadow ? (index.h("div", { class: "transition-effect" }, index.h("div", { class: "transition-cover" }), index.h("div", { class: "transition-shadow" }))) : null, index.h("slot", { key: 'd21886cff0bc417e1f5e3a436dddc079e967579b', name: "fixed" })));
+            }, ref: (scrollEl) => (this.scrollEl = scrollEl), onScroll: this.scrollEvents ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, index.h("slot", { key: '6d10fcac2e40b4dd6c20d91a8957ac07251d2fa7' })), transitionShadow ? (index.h("div", { class: "transition-effect" }, index.h("div", { class: "transition-cover" }), index.h("div", { class: "transition-shadow" }))) : null, fixedSlotPlacement === 'after' ? index.h("slot", { name: "fixed" }) : null));
     }
     get el() { return index.getElement(this); }
 };
@@ -656,7 +657,7 @@ const Footer = class {
         const mode = ionicGlobal.getIonMode(this);
         const tabs = this.el.closest('ion-tabs');
         const tabBar = tabs === null || tabs === void 0 ? void 0 : tabs.querySelector(':scope > ion-tab-bar');
-        return (index.h(index.Host, { key: 'ddc228f1a1e7fa4f707dccf74db2490ca3241137', role: "contentinfo", class: {
+        return (index.h(index.Host, { key: '5da19dc38ba73e1ddfd1bef3ebd485105d77c751', role: "contentinfo", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`footer-${mode}`]: true,
@@ -664,7 +665,7 @@ const Footer = class {
                 [`footer-translucent-${mode}`]: translucent,
                 ['footer-toolbar-padding']: !this.keyboardVisible && (!tabBar || tabBar.slot !== 'bottom'),
                 [`footer-collapse-${collapse}`]: collapse !== undefined,
-            } }, mode === 'ios' && translucent && index.h("div", { key: 'e16ed4963ff94e06de77eb8038201820af73937c', class: "footer-background" }), index.h("slot", { key: 'f186934febf85d37133d9351a96c1a64b0a4b203' })));
+            } }, mode === 'ios' && translucent && index.h("div", { key: 'fafad08090a33d8c4e8a5b63d61929dcb89aab47', class: "footer-background" }), index.h("slot", { key: 'e0a443d346afa55e4317c0bc1263fdbe3c619559' })));
     }
     get el() { return index.getElement(this); }
 };
@@ -986,14 +987,14 @@ const Header = class {
         const collapse = this.collapse || 'none';
         // banner role must be at top level, so remove role if inside a menu
         const roleType = theme.hostContext('ion-menu', this.el) ? 'none' : 'banner';
-        return (index.h(index.Host, Object.assign({ key: 'b6cc27f0b08afc9fcc889683525da765d80ba672', role: roleType, class: {
+        return (index.h(index.Host, Object.assign({ key: 'c687314ef290793a9d633ad20cfc5eeb47621e31', role: roleType, class: {
                 [mode]: true,
                 // Used internally for styling
                 [`header-${mode}`]: true,
                 [`header-translucent`]: this.translucent,
                 [`header-collapse-${collapse}`]: true,
                 [`header-translucent-${mode}`]: this.translucent,
-            } }, inheritedAttributes), mode === 'ios' && translucent && index.h("div", { key: '395766d4dcee3398bc91960db21f922095292f14', class: "header-background" }), index.h("slot", { key: '09a67ece27b258ff1248805d43d92a49b2c6859a' })));
+            } }, inheritedAttributes), mode === 'ios' && translucent && index.h("div", { key: 'b429996046082405a91e7c23f95516db0b736f12', class: "header-background" }), index.h("slot", { key: 'e17a8965f8d3a33c1bfcb056c153d8242e5229fa' })));
     }
     get el() { return index.getElement(this); }
 };
@@ -1177,7 +1178,7 @@ const RouterOutlet = class {
         return true;
     }
     render() {
-        return index.h("slot", { key: 'a70341f58d19df55de1dad00e3464388e446aa2a' });
+        return index.h("slot", { key: '8279a453c66a766e6e383ff59842b4ae070c13a9' });
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -1217,11 +1218,11 @@ const ToolbarTitle = class {
     render() {
         const mode = ionicGlobal.getIonMode(this);
         const size = this.getSize();
-        return (index.h(index.Host, { key: '5cb49f3642fb3c937cdba729ab7d561213d9bce5', class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: '5a58dc437a6f4257244bbdd7e9a682a17d8c9a6b', class: theme.createColorClasses(this.color, {
                 [mode]: true,
                 [`title-${size}`]: true,
                 'title-rtl': document.dir === 'rtl',
-            }) }, index.h("div", { key: 'f089bf6cff17ab109fec7de8b1bf96bf33bede1f', class: "toolbar-title" }, index.h("slot", { key: 'ed74c4e77126a309970ff719baa6ebaebb00d2e6' }))));
+            }) }, index.h("div", { key: '58682ea7b8f47a08adfad419b5c76b34784c6501', class: "toolbar-title" }, index.h("slot", { key: '8a9248534e4c3076f5e2dfda38ef86069796851c' }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -1289,10 +1290,10 @@ const Toolbar = class {
         this.childrenStyles.forEach((value) => {
             Object.assign(childStyles, value);
         });
-        return (index.h(index.Host, { key: 'af016bf9981a2d6182783c6643e2d460245ecc2f', class: Object.assign(Object.assign({}, childStyles), theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: '4bb3a55001408a3bdf033af76b9196cb96c07c09', class: Object.assign(Object.assign({}, childStyles), theme.createColorClasses(this.color, {
                 [mode]: true,
                 'in-toolbar': theme.hostContext('ion-toolbar', this.el),
-            })) }, index.h("div", { key: '437debb5b7c561b315d887ae8d47186cba5521ce', class: "toolbar-background" }), index.h("div", { key: '4c2429fa3e8526fedf456e4658be92d5dce8ca34', class: "toolbar-container" }, index.h("slot", { key: '4c07db12cfc48b4836b566449b854c24db308e3a', name: "start" }), index.h("slot", { key: '12855ec04622c09cc404f9b4f07f57a73e5770a0', name: "secondary" }), index.h("div", { key: '56f37d52c91de2b76910defbc9e5b7c1def3861c', class: "toolbar-content" }, index.h("slot", { key: 'c10ec3fdbea10a6388f4f510d45188f7fda1a371' })), index.h("slot", { key: 'c8ed49c6888faf35e71f2a8f4f6bf98fb0c34a25', name: "primary" }), index.h("slot", { key: '0251f3980082a092304f95cbc002bc8c633c5739', name: "end" }))));
+            })) }, index.h("div", { key: '0891db157d6e028c6d03696f13fb510ea91b0296', class: "toolbar-background" }), index.h("div", { key: '95fbc870d808f74af4bb18cd8f8ec8c7828a9e0b', class: "toolbar-container" }, index.h("slot", { key: '84d4a9644660fe00ca085055ca8d12f3647531ad', name: "start" }), index.h("slot", { key: 'fd361dc9c9979f59aed2fedcf94629506fae62b0', name: "secondary" }), index.h("div", { key: '54d2b28616a4627c55766f66dc453707752758a6', class: "toolbar-content" }, index.h("slot", { key: '8f65e0830cce7135640b90eb694e282cb7e5efd2' })), index.h("slot", { key: 'c78be11a207c8674f222543646398636956087e6', name: "primary" }), index.h("slot", { key: 'ab25e1601ccaa8cb0d81921b849bcb7402aa7826', name: "end" }))));
     }
     get el() { return index.getElement(this); }
 };