/**
 * 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-scrim-background: Specifies the background color of the scrim.
*/
:host {
  --calcite-scrim-background: var(--calcite-color-transparent-scrim);
  position: absolute;
  inset: 0px;
  z-index: var(--calcite-z-index-overlay);
  display: flex;
  block-size: 100%;
  inline-size: 100%;
  flex-direction: column;
  align-items: stretch;
}

@keyframes calcite-scrim-fade-in {
  0% {
    --tw-bg-opacity: 0;
  }
  100% {
    --tw-text-opacity: 1;
  }
}
.scrim {
  position: absolute;
  inset: 0px;
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  animation: calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;
  background-color: var(--calcite-scrim-background, var(--calcite-color-transparent-scrim));
}

.content {
  padding: 1rem;
}

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

[hidden] {
  display: none;
}