{"version":3,"file":"chatMessageList.module.mjs","names":[],"sources":["../../../../package/common/chatMessageList/chatMessageList.module.pcss"],"sourcesContent":[".chatMessageList {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n\n  &-viewport {\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    min-height: 0;\n    overflow-y: auto;\n\n    /* The component anchors the scroll position itself; the browser's own would correct it twice. */\n    overflow-anchor: none;\n    overscroll-behavior: contain;\n\n    &:focus-visible {\n      outline: 2px solid var(--focus-border-color, var(--primary-color));\n      outline-offset: -2px;\n    }\n  }\n\n  /* An auto margin rather than justify-content: flex-end, which would put an overflow above the\n     top where it can never be scrolled to. Keeps a short conversation at the bottom, by the composer. */\n  &-content {\n    display: flex;\n    flex-direction: column;\n    margin-top: auto;\n    padding: 0.75em;\n  }\n\n  /* A fixed height, so the loader showing up inside it moves nothing. */\n  &-loader {\n    display: flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    height: 2.5em;\n  }\n}\n\n/* Two classes: it is an ActionIcon, whose own one-class rules it would otherwise tie with. */\n.chatMessageList .chatMessageList-scrollButton {\n  position: absolute;\n  inset-inline-end: 0.75em;\n  bottom: 0.75em;\n  width: 2.5em;\n  height: 2.5em;\n  border-radius: 50%;\n  box-shadow: var(--card-shadow);\n}\n\n/* A Plain button over the messages needs a surface of its own. Once something new has arrived\n   below it is Filled, and keeps Button's fill. */\n.chatMessageList .chatMessageList-scrollButton-surface {\n  background: var(--background-card-elevated, var(--background));\n}\n"],"mappings":""}