/* docara-shell-source: runtime/component/modal/css/modal.css */
@layer sf.components {
  .sf-modal-focus-guard {
    position: fixed;
    width: 0;
    inline-size: 0;
    height: 0;
    block-size: 0;
    overflow: hidden;
    pointer-events: none;
  }
  /* A box that holds its own overlays: a modal inside it covers the box rather
     than the viewport (its backdrop and surface are rendered into it). */
  [data-sf-overlay-container] {
    contain: layout;
  }
  .sf-modal {
    --sf-modal-overlay-background: var(--sf-black, #000);
    --sf-modal-overlay-opacity: var(--sf-opacity-60, 0.6);
    --sf-modal-iframe-min-height: var(--sf-g2);
  }
  .sf-modal[data-sf-modal-position=left],
  .sf-modal[data-sf-modal-position=right],
  .sf-modal[data-sf-modal-position=inline-start],
  .sf-modal[data-sf-modal-position=inline-end] {
    align-items: stretch;
    padding: 0;
  }
  .sf-modal[data-sf-modal-position=left] {
    justify-content: flex-start;
  }
  .sf-modal[data-sf-modal-position=right] {
    justify-content: flex-end;
  }
  .sf-modal[data-sf-modal-position=inline-start] {
    justify-content: flex-start;
  }
  .sf-modal[data-sf-modal-position=inline-end] {
    justify-content: flex-end;
  }
  .sf-modal[data-sf-modal-position=top],
  .sf-modal[data-sf-modal-position=bottom] {
    justify-content: stretch;
    padding: 0;
  }
  .sf-modal[data-sf-modal-position=top] {
    align-items: flex-start;
  }
  .sf-modal[data-sf-modal-position=bottom] {
    align-items: flex-end;
  }
  .sf-modal[data-sf-modal-position=left] [data-sf-modal-panel],
  .sf-modal[data-sf-modal-position=right] [data-sf-modal-panel],
  .sf-modal[data-sf-modal-position=inline-start] [data-sf-modal-panel],
  .sf-modal[data-sf-modal-position=inline-end] [data-sf-modal-panel] {
    display: flex;
    max-width: min(100%, auto);
    max-width: min(100%, var(--sf-modal-drawer-width, auto));
    min-height: 100%;
    width: auto;
    width: var(--sf-modal-drawer-width, auto);
  }
  .sf-modal[data-sf-modal-position=top] [data-sf-modal-panel],
  .sf-modal[data-sf-modal-position=bottom] [data-sf-modal-panel] {
    display: flex;
    max-height: min(100%, 100vh);
    max-height: min(100%, var(--sf-modal-drawer-height, 100vh));
    min-width: 100%;
  }
  .sf-modal[data-sf-modal-position=left] [data-sf-modal-surface],
  .sf-modal[data-sf-modal-position=right] [data-sf-modal-surface],
  .sf-modal[data-sf-modal-position=inline-start] [data-sf-modal-surface],
  .sf-modal[data-sf-modal-position=inline-end] [data-sf-modal-surface],
  .sf-modal[data-sf-modal-position=top] [data-sf-modal-surface],
  .sf-modal[data-sf-modal-position=bottom] [data-sf-modal-surface] {
    flex: 1;
  }
  .sf-modal-header {
    --sf-modal-header-gap: var(--sf-space-1);
    gap: var(--sf-modal-header-gap);
  }
  .sf-modal-surface {
    --sf-modal-surface-bg: var(--sf-modal-background-color, var(--sf-surface-1, #fff));
    --sf-modal-surface-border-color: var(--sf-modal-border-color, var(--sf-outline-variant, transparent));
    --sf-modal-surface-border-style: solid;
    --sf-modal-surface-border-width: var(--sf-modal-border-width, var(--sf-border-width, var(--sf-px)));
    --sf-modal-surface-gap: var(--sf-modal-gap, var(--sf-space-1));
    --sf-modal-surface-padding: var(--sf-modal-padding-block, var(--sf-space-2)) var(--sf-modal-padding-inline, var(--sf-space-2));
    --sf-modal-surface-radius: var(--sf-modal-radius, var(--sf-radius--surface));
    --sf-modal-surface-shadow: none;
    background-color: var(--sf-modal-surface-bg);
    border: var(--sf-modal-surface-border-width) var(--sf-modal-surface-border-style) var(--sf-modal-surface-border-color);
    border-radius: var(--sf-modal-surface-radius);
    box-shadow: var(--sf-modal-surface-shadow);
    gap: var(--sf-modal-surface-gap);
    min-width: 0;
    padding: var(--sf-modal-surface-padding);
  }
  .sf-modal-surface--elevated {
    /* Elevated is a step, not a shadow alone: surface and shadow of step 3. */
    --sf-modal-surface-bg: var(--sf-modal-background-color, var(--sf-elevation-3--surface));
    --sf-on-surface-variant: var(--sf-on-elevation-3--variant);
    --sf-modal-surface-shadow: var(--sf-elevation-3--shadow);
  }
  .sf-modal [data-sf-modal-overlay] {
    background-color: var(--sf-modal-overlay-background);
    opacity: var(--sf-modal-overlay-opacity);
    transition: opacity var(--sf-duration-normal) var(--sf-animation);
  }
  .sf-modal[data-sf-modal-state=opening] [data-sf-modal-overlay] {
    opacity: 0;
  }
  .sf-modal[data-sf-modal-state=closing] [data-sf-modal-overlay] {
    opacity: 0;
  }
  .sf-modal[data-sf-modal-hidden=true] {
    pointer-events: none;
  }
  .sf-modal[data-sf-modal-hidden=true] [data-sf-modal-overlay] {
    opacity: 0;
    pointer-events: none;
  }
  .sf-modal [data-sf-modal-panel] {
    opacity: 0;
  }
  .sf-modal.animate [data-sf-modal-panel] {
    transition: opacity var(--sf-duration-normal) var(--sf-animation), -webkit-transform var(--sf-duration-normal) var(--sf-animation);
    transition: transform var(--sf-duration-normal) var(--sf-animation), opacity var(--sf-duration-normal) var(--sf-animation);
    transition: transform var(--sf-duration-normal) var(--sf-animation), opacity var(--sf-duration-normal) var(--sf-animation), -webkit-transform var(--sf-duration-normal) var(--sf-animation);
    will-change: transform, opacity;
  }
  .sf-modal[data-sf-modal-position=left] [data-sf-modal-panel] {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  .sf-modal[data-sf-modal-position=right] [data-sf-modal-panel] {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  .sf-modal[data-sf-modal-position=inline-start] [data-sf-modal-panel] {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  .sf-modal[data-sf-modal-position=inline-end] [data-sf-modal-panel] {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  .sf-modal[data-sf-modal-position=inline-start]:dir(rtl) [data-sf-modal-panel] {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  .sf-modal[data-sf-modal-position=inline-end]:dir(rtl) [data-sf-modal-panel] {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  .sf-modal[data-sf-modal-position=top] [data-sf-modal-panel] {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  .sf-modal[data-sf-modal-position=bottom] [data-sf-modal-panel] {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  .sf-modal[data-sf-modal-position=center] [data-sf-modal-panel] {
    -webkit-transform: translateY(var(--sf-space-1\/2)) scale(0.98);
            transform: translateY(var(--sf-space-1\/2)) scale(0.98);
  }
  .sf-modal[data-sf-modal-state=opening] [data-sf-modal-panel] {
    opacity: 0;
  }
  .sf-modal[data-sf-modal-state=open] [data-sf-modal-panel] {
    opacity: 1;
    -webkit-transform: translate(0, 0) scale(1);
            transform: translate(0, 0) scale(1);
  }
  .sf-modal[data-sf-modal-state=closing] [data-sf-modal-panel] {
    opacity: 0;
  }
  .sf-modal[data-sf-modal-state=inline] [data-sf-modal-panel] {
    opacity: 1;
    -webkit-transform: translate(0, 0) scale(1);
            transform: translate(0, 0) scale(1);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=left] [data-sf-modal-panel] {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=right] [data-sf-modal-panel] {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=inline-start] [data-sf-modal-panel] {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=inline-end] [data-sf-modal-panel] {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=inline-start]:dir(rtl) [data-sf-modal-panel] {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=inline-end]:dir(rtl) [data-sf-modal-panel] {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=top] [data-sf-modal-panel] {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=bottom] [data-sf-modal-panel] {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  .sf-modal[data-sf-modal-state=closing][data-sf-modal-position=center] [data-sf-modal-panel] {
    -webkit-transform: translateY(var(--sf-space-1\/2)) scale(0.98);
            transform: translateY(var(--sf-space-1\/2)) scale(0.98);
  }
  .sf-modal[data-sf-modal-state][data-sf-modal-hidden=true] [data-sf-modal-panel] {
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translateY(var(--sf-space-1\/2)) scale(0.98);
            transform: translateY(var(--sf-space-1\/2)) scale(0.98);
  }
  .sf-modal [data-sf-modal-panel][data-sf-modal-has-width] {
    max-width: min(100%, var(--sf-modal-width));
    width: var(--sf-modal-width);
  }
  .sf-modal [data-sf-modal-panel][data-sf-modal-has-height] {
    display: flex;
    height: var(--sf-modal-height);
    max-height: min(100%, var(--sf-modal-height));
  }
  .sf-modal [data-sf-modal-panel][data-sf-modal-has-height] [data-sf-modal-surface] {
    flex: 1;
    min-height: 0;
  }
  .sf-modal [data-sf-modal-panel][data-sf-modal-has-height] [data-sf-modal-body],
  .sf-modal [data-sf-modal-panel][data-sf-modal-has-height] [data-sf-modal-body-viewport] {
    flex: 1;
    min-height: 0;
  }
  .sf-modal [data-sf-modal-panel][data-sf-modal-has-height] [data-sf-modal-body-scroll] {
    flex: 1;
    max-height: none;
  }
  .sf-modal[data-sf-modal-fullscreen=true] {
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
  }
  .sf-modal[data-sf-modal-fullscreen=true] [data-sf-modal-panel] {
    display: flex;
    height: 100%;
    max-height: 100%;
    max-width: 100%;
    width: 100%;
  }
  .sf-modal[data-sf-modal-fullscreen=true] [data-sf-modal-surface] {
    border-radius: 0;
    flex: 1;
    min-height: 0;
  }
  .sf-modal[data-sf-modal-fullscreen=true] [data-sf-modal-body],
  .sf-modal[data-sf-modal-fullscreen=true] [data-sf-modal-body-viewport] {
    flex: 1;
    min-height: 0;
  }
  .sf-modal[data-sf-modal-fullscreen=true] [data-sf-modal-body-scroll] {
    flex: 1;
    max-height: none;
  }
  @media (prefers-reduced-motion: reduce) {
    .sf-modal.animate [data-sf-modal-panel],
    .sf-modal [data-sf-modal-overlay] {
      transition: none;
      will-change: auto;
    }
  }
}
@layer sf.components {
  .sf-modal-header-content {
    flex: 1 1 auto;
    min-width: 0;
    word-wrap: anywhere;
  }
  .sf-modal-header-action {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    justify-content: center;
    min-height: var(--sf-ui-1\/3--control-height);
    min-block-size: var(--sf-ui-1\/3--control-height);
    min-width: var(--sf-ui-1\/3--control-height);
    min-inline-size: var(--sf-ui-1\/3--control-height);
  }
  .sf-modal-close-button {
    --sf-modal-close-right: var(--sf-space-1\/3);
    --sf-modal-close-top: var(--sf-space-1\/3);
    right: var(--sf-modal-close-right);
    top: var(--sf-modal-close-top);
    left: var(--sf-modal-close-left);
    bottom: var(--sf-modal-close-bottom);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .sf-modal-close-button--inline-end {
    right: var(--sf-modal-close-right);
    right: var(--sf-modal-close-inline-end, var(--sf-modal-close-right));
  }
  @supports not (inset-inline-end: initial) {
  html:not([dir="rtl"]) .sf-modal-close-button--inline-end {
    right: var(--sf-modal-close-right);
    right: var(--sf-modal-close-inline-end, var(--sf-modal-close-right));
    }
  }
  .sf-modal-close-button--inline-end:where(:dir(ltr)) {
    right: var(--sf-modal-close-right);
    right: var(--sf-modal-close-inline-end, var(--sf-modal-close-right));
  }
  _:-ms-input-placeholder, [dir="rtl"] .sf-modal-close-button--inline-end {
    left: var(--sf-modal-close-right);
    left: var(--sf-modal-close-inline-end, var(--sf-modal-close-right));
  }
  @supports not (inset-inline-end: initial) {
  [dir="rtl"] .sf-modal-close-button--inline-end {
    left: var(--sf-modal-close-right);
    left: var(--sf-modal-close-inline-end, var(--sf-modal-close-right));
    }
  }
  .sf-modal-close-button--inline-end:where(:dir(rtl)) {
    left: var(--sf-modal-close-right);
    left: var(--sf-modal-close-inline-end, var(--sf-modal-close-right));
  }
  .sf-modal-close-button--inline-end {
    left: auto;
    right: auto;
    inset-inline-end: var(--sf-modal-close-right);
    inset-inline-end: var(--sf-modal-close-inline-end, var(--sf-modal-close-right));
  }
  .sf-modal-hide-button {
    --sf-modal-hide-right: var(--sf-space-2);
    --sf-modal-hide-top: var(--sf-space-1\/3);
    right: var(--sf-modal-hide-right);
    top: var(--sf-modal-hide-top);
    left: var(--sf-modal-hide-left);
    bottom: var(--sf-modal-hide-bottom);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .sf-modal-hide-button--inline-end {
    right: var(--sf-modal-hide-right);
    right: var(--sf-modal-hide-inline-end, var(--sf-modal-hide-right));
  }
  @supports not (inset-inline-end: initial) {
  html:not([dir="rtl"]) .sf-modal-hide-button--inline-end {
    right: var(--sf-modal-hide-right);
    right: var(--sf-modal-hide-inline-end, var(--sf-modal-hide-right));
    }
  }
  .sf-modal-hide-button--inline-end:where(:dir(ltr)) {
    right: var(--sf-modal-hide-right);
    right: var(--sf-modal-hide-inline-end, var(--sf-modal-hide-right));
  }
  _:-ms-input-placeholder, [dir="rtl"] .sf-modal-hide-button--inline-end {
    left: var(--sf-modal-hide-right);
    left: var(--sf-modal-hide-inline-end, var(--sf-modal-hide-right));
  }
  @supports not (inset-inline-end: initial) {
  [dir="rtl"] .sf-modal-hide-button--inline-end {
    left: var(--sf-modal-hide-right);
    left: var(--sf-modal-hide-inline-end, var(--sf-modal-hide-right));
    }
  }
  .sf-modal-hide-button--inline-end:where(:dir(rtl)) {
    left: var(--sf-modal-hide-right);
    left: var(--sf-modal-hide-inline-end, var(--sf-modal-hide-right));
  }
  .sf-modal-hide-button--inline-end {
    left: auto;
    right: auto;
    inset-inline-end: var(--sf-modal-hide-right);
    inset-inline-end: var(--sf-modal-hide-inline-end, var(--sf-modal-hide-right));
  }
  .sf-modal-hide-icon {
    background-color: currentColor;
    display: block;
    height: 2px;
    height: var(--sf-border-width-2, 2px);
    width: var(--sf-space-1);
  }
}

/* docara-shell-source: runtime/utility/container/default/css/default.css */
@layer sf.utilities {
  _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
    padding-left: var(--sf-space-1);
  }
  @supports not (padding-inline-start: initial) {
  html:not([dir="rtl"]) .container {
    padding-left: var(--sf-space-1);
    }
  }
  .container:where(:dir(ltr)) {
    padding-left: var(--sf-space-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .container {
    padding-right: var(--sf-space-1);
  }
  @supports not (padding-inline-start: initial) {
  [dir="rtl"] .container {
    padding-right: var(--sf-space-1);
    }
  }
  .container:where(:dir(rtl)) {
    padding-right: var(--sf-space-1);
  }
  _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
    padding-right: var(--sf-space-1);
  }
  @supports not (padding-inline-end: initial) {
  html:not([dir="rtl"]) .container {
    padding-right: var(--sf-space-1);
    }
  }
  .container:where(:dir(ltr)) {
    padding-right: var(--sf-space-1);
  }
  _:-ms-input-placeholder, [dir="rtl"] .container {
    padding-left: var(--sf-space-1);
  }
  @supports not (padding-inline-end: initial) {
  [dir="rtl"] .container {
    padding-left: var(--sf-space-1);
    }
  }
  .container:where(:dir(rtl)) {
    padding-left: var(--sf-space-1);
  }
  .container {
    width: 100%;
    -webkit-padding-start: var(--sf-space-1);
            padding-inline-start: var(--sf-space-1);
    -webkit-padding-end: var(--sf-space-1);
            padding-inline-end: var(--sf-space-1);
  }
  @media (min-width: 32rem) {
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-2);
    }
    @supports not (padding-inline-start: initial) {
    html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-2);
      }
    }
    .container:where(:dir(ltr)) {
      padding-left: var(--sf-space-2);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-right: var(--sf-space-2);
    }
    @supports not (padding-inline-start: initial) {
    [dir="rtl"] .container {
      padding-right: var(--sf-space-2);
      }
    }
    .container:where(:dir(rtl)) {
      padding-right: var(--sf-space-2);
    }
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-2);
    }
    @supports not (padding-inline-end: initial) {
    html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-2);
      }
    }
    .container:where(:dir(ltr)) {
      padding-right: var(--sf-space-2);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-left: var(--sf-space-2);
    }
    @supports not (padding-inline-end: initial) {
    [dir="rtl"] .container {
      padding-left: var(--sf-space-2);
      }
    }
    .container:where(:dir(rtl)) {
      padding-left: var(--sf-space-2);
    }
    .container {
      width: 100%;
      max-width: var(--sf-breakpoint-sm);
      -webkit-padding-start: var(--sf-space-2);
              padding-inline-start: var(--sf-space-2);
      -webkit-padding-end: var(--sf-space-2);
              padding-inline-end: var(--sf-space-2);
    }
  }
  @media (min-width: 44rem) {
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-3);
    }
    @supports not (padding-inline-start: initial) {
    html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-3);
      }
    }
    .container:where(:dir(ltr)) {
      padding-left: var(--sf-space-3);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-right: var(--sf-space-3);
    }
    @supports not (padding-inline-start: initial) {
    [dir="rtl"] .container {
      padding-right: var(--sf-space-3);
      }
    }
    .container:where(:dir(rtl)) {
      padding-right: var(--sf-space-3);
    }
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-3);
    }
    @supports not (padding-inline-end: initial) {
    html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-3);
      }
    }
    .container:where(:dir(ltr)) {
      padding-right: var(--sf-space-3);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-left: var(--sf-space-3);
    }
    @supports not (padding-inline-end: initial) {
    [dir="rtl"] .container {
      padding-left: var(--sf-space-3);
      }
    }
    .container:where(:dir(rtl)) {
      padding-left: var(--sf-space-3);
    }
    .container {
      width: 100%;
      max-width: var(--sf-breakpoint-md);
      -webkit-padding-start: var(--sf-space-3);
              padding-inline-start: var(--sf-space-3);
      -webkit-padding-end: var(--sf-space-3);
              padding-inline-end: var(--sf-space-3);
    }
  }
  @media (min-width: 60rem) {
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-4);
    }
    @supports not (padding-inline-start: initial) {
    html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-4);
      }
    }
    .container:where(:dir(ltr)) {
      padding-left: var(--sf-space-4);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-right: var(--sf-space-4);
    }
    @supports not (padding-inline-start: initial) {
    [dir="rtl"] .container {
      padding-right: var(--sf-space-4);
      }
    }
    .container:where(:dir(rtl)) {
      padding-right: var(--sf-space-4);
    }
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-4);
    }
    @supports not (padding-inline-end: initial) {
    html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-4);
      }
    }
    .container:where(:dir(ltr)) {
      padding-right: var(--sf-space-4);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-left: var(--sf-space-4);
    }
    @supports not (padding-inline-end: initial) {
    [dir="rtl"] .container {
      padding-left: var(--sf-space-4);
      }
    }
    .container:where(:dir(rtl)) {
      padding-left: var(--sf-space-4);
    }
    .container {
      width: 100%;
      max-width: var(--sf-breakpoint-lg);
      -webkit-padding-start: var(--sf-space-4);
              padding-inline-start: var(--sf-space-4);
      -webkit-padding-end: var(--sf-space-4);
              padding-inline-end: var(--sf-space-4);
    }
  }
  @media (min-width: 72rem) {
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-5);
    }
    @supports not (padding-inline-start: initial) {
    html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-5);
      }
    }
    .container:where(:dir(ltr)) {
      padding-left: var(--sf-space-5);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-right: var(--sf-space-5);
    }
    @supports not (padding-inline-start: initial) {
    [dir="rtl"] .container {
      padding-right: var(--sf-space-5);
      }
    }
    .container:where(:dir(rtl)) {
      padding-right: var(--sf-space-5);
    }
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-5);
    }
    @supports not (padding-inline-end: initial) {
    html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-5);
      }
    }
    .container:where(:dir(ltr)) {
      padding-right: var(--sf-space-5);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-left: var(--sf-space-5);
    }
    @supports not (padding-inline-end: initial) {
    [dir="rtl"] .container {
      padding-left: var(--sf-space-5);
      }
    }
    .container:where(:dir(rtl)) {
      padding-left: var(--sf-space-5);
    }
    .container {
      width: 100%;
      max-width: var(--sf-breakpoint-xl);
      -webkit-padding-start: var(--sf-space-5);
              padding-inline-start: var(--sf-space-5);
      -webkit-padding-end: var(--sf-space-5);
              padding-inline-end: var(--sf-space-5);
    }
  }
  @media (min-width: 80rem) {
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-6);
    }
    @supports not (padding-inline-start: initial) {
    html:not([dir="rtl"]) .container {
      padding-left: var(--sf-space-6);
      }
    }
    .container:where(:dir(ltr)) {
      padding-left: var(--sf-space-6);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-right: var(--sf-space-6);
    }
    @supports not (padding-inline-start: initial) {
    [dir="rtl"] .container {
      padding-right: var(--sf-space-6);
      }
    }
    .container:where(:dir(rtl)) {
      padding-right: var(--sf-space-6);
    }
    _:-ms-input-placeholder, html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-6);
    }
    @supports not (padding-inline-end: initial) {
    html:not([dir="rtl"]) .container {
      padding-right: var(--sf-space-6);
      }
    }
    .container:where(:dir(ltr)) {
      padding-right: var(--sf-space-6);
    }
    _:-ms-input-placeholder, [dir="rtl"] .container {
      padding-left: var(--sf-space-6);
    }
    @supports not (padding-inline-end: initial) {
    [dir="rtl"] .container {
      padding-left: var(--sf-space-6);
      }
    }
    .container:where(:dir(rtl)) {
      padding-left: var(--sf-space-6);
    }
    .container {
      width: 100%;
      max-width: var(--sf-breakpoint-xxl);
      -webkit-padding-start: var(--sf-space-6);
              padding-inline-start: var(--sf-space-6);
      -webkit-padding-end: var(--sf-space-6);
              padding-inline-end: var(--sf-space-6);
    }
  }
}

/* docara-shell-source: runtime/utility/cursor/default/css/default.css */
@layer sf.utilities {
  .cursor-auto {
    cursor: auto;
  }
  .cursor-default {
    cursor: default;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .cursor-wait {
    cursor: wait;
  }
  .cursor-text {
    cursor: text;
  }
  .cursor-move {
    cursor: move;
  }
  .cursor-help {
    cursor: help;
  }
  .cursor-grab {
    cursor: -webkit-grab;
    cursor: grab;
  }
  .cursor-grabbing {
    cursor: -webkit-grabbing;
    cursor: grabbing;
  }
  .cursor-not-allowed {
    cursor: not-allowed;
  }
  .cursor-no-drop {
    cursor: no-drop;
  }
  .cursor-context-menu {
    cursor: context-menu;
  }
  .cursor-progress {
    cursor: progress;
  }
  .cursor-crosshair {
    cursor: crosshair;
  }
  .cursor-cell {
    cursor: cell;
  }
  .cursor-alias {
    cursor: alias;
  }
  .cursor-copy {
    cursor: copy;
  }
  .cursor-zoom-in {
    cursor: -webkit-zoom-in;
    cursor: zoom-in;
  }
  .cursor-zoom-out {
    cursor: -webkit-zoom-out;
    cursor: zoom-out;
  }
  .cursor-all-scroll {
    cursor: all-scroll;
  }
  .cursor-w-resize {
    cursor: w-resize;
  }
  .cursor-e-resize {
    cursor: e-resize;
  }
  .cursor-n-resize {
    cursor: n-resize;
  }
  .cursor-s-resize {
    cursor: s-resize;
  }
  .cursor-ew-resize {
    cursor: ew-resize;
  }
  .cursor-ns-resize {
    cursor: ns-resize;
  }
  .cursor-ne-resize {
    cursor: ne-resize;
  }
  .cursor-nw-resize {
    cursor: nw-resize;
  }
  .cursor-se-resize {
    cursor: se-resize;
  }
  .cursor-sw-resize {
    cursor: sw-resize;
  }
  .cursor-nesw-resize {
    cursor: nesw-resize;
  }
  .cursor-nwse-resize {
    cursor: nwse-resize;
  }
  .cursor-col-resize {
    cursor: col-resize;
  }
  .cursor-row-resize {
    cursor: row-resize;
  }
  .cursor-vertical-text {
    cursor: vertical-text;
  }
}

/* docara-shell-source: runtime/utility/display/default/css/default.css */
@layer sf.utilities {
  .block {
    display: block;
  }
  .inline-block {
    display: inline-block;
  }
  .inline {
    display: inline;
  }
  .flex {
    display: flex;
  }
  .inline-flex {
    display: inline-flex;
  }
  .table {
    display: table;
  }
  .display-table {
    display: table;
  }
  .inline-table {
    display: inline-table;
  }
  .table-caption {
    display: table-caption;
  }
  .table-cell {
    display: table-cell;
  }
  .table-column {
    display: table-column;
  }
  .table-column-group {
    display: table-column-group;
  }
  .table-footer-group {
    display: table-footer-group;
  }
  .table-header-group {
    display: table-header-group;
  }
  .table-row-group {
    display: table-row-group;
  }
  .table-row {
    display: table-row;
  }
  .flow-root {
    display: flow-root;
  }
  .grid {
    display: grid;
  }
  .inline-grid {
    display: inline-grid;
  }
  .content {
    display: contents;
  }
  .list-item {
    display: list-item;
  }
  .hidden {
    display: none;
  }
}