/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */
@layer sdc {
  /**
 * Throbber.
 */
  .ajax-progress-throbber {
    position: relative;
    display: inline-flex;
    align-content: center;
    height: 1.125rem;
    margin-top: -0.1875rem;
    margin-bottom: 0;
    vertical-align: middle;
    white-space: nowrap;
    line-height: 1.125rem;
  }
  .ajax-progress-throbber .throbber {
    width: 1.125rem;
    height: 1.125rem;
    border-width: 2px;
    border-color: #2494db transparent #2494db #2494db;
  }
  .ajax-progress-throbber .message {
    display: inline-block;
    font-size: 0.875rem;
    font-weight: 400;
  }
  [dir="ltr"] .ajax-progress-throbber {
    margin-left: 0.5625rem;
  }
  [dir="ltr"] .ajax-progress-throbber .message {
    padding-left: 0.5625rem;
  }
  [dir="rtl"] .ajax-progress-throbber {
    margin-right: 0.5625rem;
  }
  [dir="rtl"] .ajax-progress-throbber .message {
    padding-right: 0.5625rem;
  }

  /* Full screen throbber */
  .ajax-progress-fullscreen {
    position: fixed;
    top: calc(50% - 2.5rem);
    width: 5rem;
    height: 5rem;
    animation: rotate 1s linear infinite;
    border-radius: 50%;
    background-color: hsl(0, 0%, 100%);
    box-shadow: 0 0 10px rgb(0, 0, 0, 0.1);
  }
  .page-node-type-home-page .ajax-progress-fullscreen {
    display: none;
  }
  .ajax-progress-fullscreen:before {
    position: absolute;
    box-sizing: border-box;
    content: "";
    animation: animateclip 2s linear infinite;
    border: 3px solid hsl(180, 83%, 36%);
    border-radius: 50%;
    inset: 1.25rem;
  }
  [dir="ltr"] .ajax-progress-fullscreen {
    left: calc(50% - 2.5rem);
  }
  [dir="rtl"] .ajax-progress-fullscreen {
    right: calc(50% - 2.5rem);
  }
  /* =============================================
=           Custom ajax loader                 =
============================================= */

  /**
 * @file
 * Throbber.
 */
  @keyframes rotate {
    to {
      transform: rotate(1turn);
    }
  }
  @keyframes animateclip {
    0% {
      clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);
    }
    25% {
      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);
    }
    50% {
      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);
    }
    75% {
      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);
    }
    to {
      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);
    }
  }
}