/**
 * Do not edit directly
 * Generated on Fri, 02 Aug 2024 20:03:08 GMT
 */
/**
 * Do not edit directly
 * Generated on Fri, 02 Aug 2024 20:03:08 GMT
 */
/**
 * Do not edit directly
 * Generated on Fri, 02 Aug 2024 20:03:08 GMT
 */
/**
 * Do not edit directly
 * Generated on Fri, 02 Aug 2024 20:03:08 GMT
 */
/**
 * Do not edit directly
 * Generated on Fri, 02 Aug 2024 20:03:06 GMT
 */
/* mixins & extensions */
/* helper to properly scale internal durations */
/**
* Currently only used in Checkbox.
*/
/**
* CSS Custom Properties
*
* These properties can be overridden using the component's tag as selector.
*
* @prop --calcite-sheet-scrim-background: Specifies the background color of the sheet scrim.
* @prop --calcite-sheet-width: When `position` is `"inline-start"` or `"inline-end"`, specifies the width of the component.
* @prop --calcite-sheet-max-width: When `position` is `"inline-start"` or `"inline-end"`, specifies the maximum width of the component.
* @prop --calcite-sheet-min-width: When `position` is `"inline-start"` or `"inline-end"`, specifies the minimum width of the component.
* @prop --calcite-sheet-height:  When `position` is `"block-start"` or `"block-end"`, specifies the height of the component.
* @prop --calcite-sheet-max-height:  When `position` is `"block-start"` or `"block-end"`, specifies the maximum height of the component.
* @prop --calcite-sheet-min-height:  When `position` is `"block-start"` or `"block-end"`, specifies the minimum height of the component.
*
*/
:host {
  position: absolute;
  inset: 0px;
  z-index: var(--calcite-z-index-overlay);
  display: flex;
  visibility: hidden !important;
  --calcite-sheet-scrim-background-internal: rgba(0, 0, 0, 0.85);
  --calcite-scrim-shadow-block-start-internal: 0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);
  --calcite-scrim-shadow-block-end-internal: 0 -4px 8px -1px rgba(0, 0, 0, 0.08), 0 -2px 4px -1px rgba(0, 0, 0, 0.04);
  --calcite-scrim-shadow-inline-start-internal: 4px 0 8px -1px rgba(0, 0, 0, 0.08), 2px 0 4px -1px rgba(0, 0, 0, 0.04);
  --calcite-scrim-shadow-inline-end-internal: -4px 0 8px -1px rgba(0, 0, 0, 0.08), -2px 0 4px -1px rgba(0, 0, 0, 0.04);
}

.calcite--rtl {
  --calcite-scrim-shadow-inline-start-internal: -4px 0 8px -1px rgba(0, 0, 0, 0.08), -2px 0 4px -1px rgba(0, 0, 0, 0.04);
  --calcite-scrim-shadow-inline-end-internal: 4px 0 8px -1px rgba(0, 0, 0, 0.08), 2px 0 4px -1px rgba(0, 0, 0, 0.04);
}

.container {
  visibility: hidden;
  position: fixed;
  z-index: var(--calcite-z-index-overlay);
  display: flex;
  overflow-y: hidden;
  color: var(--calcite-color-text-2);
  opacity: 0;
  transition: visibility 0ms linear var(--calcite-internal-animation-timing-medium), opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88);
}

:host([position=inline-start]) .container {
  justify-content: flex-start;
  inset-block: 0;
  inset-inline: 0 auto;
  --calcite-sheet-hidden-position-internal: translate3d(-1rem, 0, 0);
}

:host([position=inline-end]) .container {
  justify-content: flex-end;
  inset-block: 0;
  inset-inline: auto 0;
  --calcite-sheet-hidden-position-internal: translate3d(1rem, 0, 0);
}

:host([position=block-start]) .container {
  align-items: flex-start;
  inset-block: 0 auto;
  inset-inline: 0;
  --calcite-sheet-hidden-position-internal: translate3d(0, -1rem, 0);
}

:host([position=block-end]) .container {
  align-items: flex-end;
  inset-block: auto 0;
  inset-inline: 0;
  --calcite-sheet-hidden-position-internal: translate3d(0, 1rem, 0);
}

:host([display-mode=float]) .content {
  --tw-shadow: 0 2px 12px -4px rgba(0, 0, 0, 0.2), 0 2px 4px -2px rgba(0, 0, 0, 0.16);
  --tw-shadow-colored: 0 2px 12px -4px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

:host([display-mode=overlay][position=inline-start]) .container {
  box-shadow: var(--calcite-scrim-shadow-inline-start-internal);
}

:host([display-mode=overlay][position=inline-end]) .container {
  box-shadow: var(--calcite-scrim-shadow-inline-end-internal);
}

:host([display-mode=overlay][position=block-start]) .container {
  box-shadow: var(--calcite-scrim-shadow-block-start-internal);
}

:host([display-mode=overlay][position=block-end]) .container {
  box-shadow: var(--calcite-scrim-shadow-block-end-internal);
}

:host([position^=inline]) .container,
:host([position^=inline]) .content {
  inline-size: var(--calcite-sheet-width-internal);
  max-inline-size: var(--calcite-sheet-max-width-internal);
  min-inline-size: var(--calcite-sheet-min-width-internal);
}

:host([position^=block]) .container,
:host([position^=block]) .content {
  block-size: var(--calcite-sheet-height-internal);
  max-block-size: var(--calcite-sheet-max-height-internal);
  min-block-size: var(--calcite-sheet-min-height-internal);
}

:host([display-mode=float][position^=inline]) .container {
  block-size: calc(100% - 1.5rem);
  max-block-size: calc(100% - 1.5rem);
  min-block-size: calc(100% - 1.5rem);
}

:host([display-mode=float][position^=block]) .container {
  inline-size: calc(100% - 1.5rem);
  max-inline-size: calc(100% - 1.5rem);
  min-inline-size: calc(100% - 1.5rem);
}

:host([position^=inline][width-scale=s]) {
  --calcite-sheet-width-internal: var(--calcite-sheet-width, 15vw);
  --calcite-sheet-max-width-internal: var(--calcite-sheet-max-width, 360px);
  --calcite-sheet-min-width-internal: var(--calcite-sheet-min-width, 260px);
}

:host([position^=inline][width-scale=m]) {
  --calcite-sheet-width-internal: var(--calcite-sheet-width, 25vw);
  --calcite-sheet-max-width-internal: var(--calcite-sheet-max-width, 420px);
  --calcite-sheet-min-width-internal: var(--calcite-sheet-min-width, 300px);
}

:host([position^=inline][width-scale=l]) {
  --calcite-sheet-width-internal: var(--calcite-sheet-width, 45vw);
  --calcite-sheet-max-width-internal: var(--calcite-sheet-max-width, 680px);
  --calcite-sheet-min-width-internal: var(--calcite-sheet-min-width, 340px);
}

:host([position^=block][height-scale=s]) {
  --calcite-sheet-min-height-internal: var(--calcite-sheet-min-height, 160px);
  --calcite-sheet-height-internal: var(--calcite-sheet-height, 30vh);
  --calcite-sheet-max-height-internal: var(--calcite-sheet-max-height, 30vh);
}

:host([position^=block][height-scale=m]) {
  --calcite-sheet-min-height-internal: var(--calcite-sheet-min-height, 200px);
  --calcite-sheet-height-internal: var(--calcite-sheet-height, 45vh);
  --calcite-sheet-max-height-internal: var(--calcite-sheet-max-height, 50vh);
}

:host([position^=block][height-scale=l]) {
  --calcite-sheet-min-height-internal: var(--calcite-sheet-min-height, 240px);
  --calcite-sheet-height-internal: var(--calcite-sheet-height, 60vh);
  --calcite-sheet-max-height-internal: var(--calcite-sheet-max-height, 70vh);
}

.scrim {
  --calcite-scrim-background: var(--calcite-sheet-scrim-background, var(--calcite-sheet-scrim-background-internal));
  position: fixed;
  inset: 0px;
  display: flex;
  overflow-y: hidden;
}

:host([opened]) {
  visibility: visible !important;
}

.content {
  position: relative;
  z-index: var(--calcite-z-index-modal);
  box-sizing: border-box;
  display: block;
  max-block-size: 100%;
  max-inline-size: 100%;
  overflow-y: hidden;
  padding: 0px;
  background-color: var(--calcite-color-foreground-1);
  max-block-size: 100%;
  visibility: hidden;
  transition: transform var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear var(--calcite-internal-animation-timing-medium), opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88);
  transform: var(--calcite-sheet-hidden-position-internal);
}

.container--open .content {
  transform: translate3d(0, 0, 0);
}

:host([display-mode=float]) .content,
:host([display-mode=float]) .container {
  border-radius: 0.25rem;
}

:host([display-mode=float]) .container {
  padding: 0.75rem;
}

.container--open {
  visibility: visible;
  opacity: 1;
  transition-delay: 0ms;
}
.container--open .content {
  pointer-events: auto;
  visibility: visible;
  opacity: 1;
  transition: transform var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), visibility 0ms linear, opacity var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-inline-size var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88), max-block-size var(--calcite-internal-animation-timing-medium) cubic-bezier(0.215, 0.44, 0.42, 0.88);
  transition-delay: 0ms;
}

:host([position=inline-start]) .content,
:host([position=inline-end]) .content {
  block-size: 100%;
}

:host([position=block-start]) .content,
:host([position=block-end]) .content {
  inline-size: 100%;
}

/**
 * Conditional styles for when Sheet is slotted in Shell
 */
:host([position]) .container--embedded {
  pointer-events: auto;
  position: absolute;
  inline-size: 100%;
  max-inline-size: 100%;
  min-inline-size: 100%;
  block-size: 100%;
  max-block-size: 100%;
  min-block-size: 100%;
}
:host([position]) .container--embedded calcite-scrim {
  position: absolute;
}

:host([hidden]) {
  display: none;
}

[hidden] {
  display: none;
}