@layer customer {
  .modal {
    display: block;
    max-width: var(--size-content-2);
  }

  .modal\/title {
    background-color: var(--gray-2);
    border-bottom: solid 1px var(--gray-4);
    border-top-left-radius: var(--radius-1);
    border-top-right-radius: var(--radius-1);
    box-shadow: var(--shadow-1);
    display: block;
    font-size: var(--font-size-2);
    font-weight: var(--font-weight-5);
    padding: var(--size-2);
  }

  .modal\/content {
    padding: var(--size-2);
  }

  .modal-container {
    border-radius: var(--radius-1);
    border: solid 1px var(--gray-4);
    box-shadow: var(--shadow-4);
    margin: var(--size-12) auto 0 auto;
    padding: 0;
  }

  .modal-container::backdrop {
    background-color: black;
    opacity: 0.3;
  }
}