/* stylelint-disable */
/* stylelint-disable max-line-length */
:root {
  --breakpoint-xxl: 1920px;
  --breakpoint-xl: 1440px;
  --breakpoint-lg-2: 1397px;
  --breakpoint-lg: 1280px;
  --breakpoint-md: 1024px;
  --breakpoint-md-s: 992px;
  --breakpoint-sm: 768px;
  --breakpoint-xs: 512px;
  --breakpoint-xxs: 390px;
}

/* stylelint-disable */
/* stylelint-disable */
/* stylelint-disable */
/*
  This mixin can be used to set the object-fit:
  @include object-fit(contain);

  or object-fit and object-position:
  @include object-fit(cover, top);
*/
.chat-base-date {
  font-family: var(--sk-font-primary), serif;
  padding: 0 0 20px;
}
.chat-base-date__container {
  max-width: 1355px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}
.chat-base-date__chat-wrapper {
  max-width: 1046px;
  width: 100%;
  margin: 0 auto;
}
.chat-base-date__chat-btn-handle {
  display: flex;
  position: absolute;
  bottom: 5px;
  left: 42px;
}
.chat-base-date__chat-btn-handle.hide {
  display: none;
}
@media (max-width: 768px) {
  .chat-base-date__chat-btn-handle {
    left: 10px;
  }
}
.chat-base-date__chat-btn-handle button {
  border: none;
  background-color: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
  color: var(--sk-color-gray-1);
}
.chat-base-date__chat-btn-handle button:hover {
  color: var(--sk-color-text);
}
.chat-base-date__title {
  margin-bottom: 43px;
}
.chat-base-date__title .decor-underline {
  position: relative;
}
.chat-base-date__title .decor-underline::after {
  background-image: url('data:image/svg+xml,<svg width="136" height="18" viewBox="0 0 136 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.0295 4.04414L51.6753 4.53048C64.8035 4.65963 77.9317 4.78878 91.0599 4.91591C88.8771 5.12578 86.6958 5.33565 84.513 5.54351C69.5794 6.97628 54.6457 8.41108 39.7136 9.84385C31.33 10.649 22.9463 11.4542 14.5627 12.2574C13.667 12.3441 12.4488 13.0182 12.1951 14.2471C11.9602 15.3832 12.7165 16.2429 13.5856 16.2934C29.3006 17.2055 45.0282 17.7463 60.7588 17.9299C76.3001 18.1136 91.8444 17.936 107.382 17.3992C116.111 17.0985 124.837 16.6808 133.559 16.1541C134.502 16.0976 135.867 15.2642 135.991 13.902C136.122 12.4693 134.807 12.0616 133.972 12.1121C118.447 13.0504 102.909 13.6336 87.3676 13.8556C72.5905 14.0655 57.9888 13.9484 43.2807 13.5065C48.5044 13.004 53.7281 12.5036 58.9518 12.0011C73.8855 10.5683 88.8192 9.13352 103.751 7.70074C112.135 6.89556 120.519 6.09038 128.902 5.28722C129.846 5.19641 131.207 4.41949 131.334 3.03514C131.469 1.55797 130.145 1.25325 129.316 1.24518C112.768 1.08374 96.2179 0.920285 79.6698 0.758845C63.2094 0.597406 46.7475 0.435966 30.2871 0.274527C21.0047 0.181699 11.7222 0.0908896 2.44132 7.99121e-05C1.50337 -0.0100101 0.130103 0.936429 0.00953134 2.25216C-0.125133 3.72933 1.19802 4.03405 2.02793 4.04212L2.0295 4.04414Z" fill="%23F3B400"/></svg>');
  content: "";
  display: block;
  position: absolute;
  bottom: -11px;
  left: -6px;
  width: 100%;
  min-width: 136px;
  height: 18px;
  background-size: cover;
}
.chat-base-date__chat-preview {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.chat-base-date__chat-preview.hide {
  display: none;
}
.chat-base-date__chat-preview-text {
  font-size: 40px;
  display: block;
  margin-top: 20px;
  line-height: 1.2;
  text-align: center;
}
.chat-base-date__chat-window-wrapper {
  height: 620px;
  padding: 28px 18px 50px;
  overflow: hidden;
  /* stylelint-disable */
  backdrop-filter: blur(22.2px);
  box-shadow: inset 2px 2px 2px 0 rgba(229, 229, 229, 0.25), inset -2px -2px 2px 0px rgba(229, 229, 229, 0.5), 4px 4px 12px 0px rgba(0, 0, 0, 0.25), 0px 2px 8px 2px rgba(72, 72, 72, 0.1);
  /* stylelint-enable */
  border-radius: 20px;
  margin-bottom: 20px;
  background-color: var(--sk-color-gray-8);
}
.chat-base-date__chat-window {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  overflow-y: auto;
  padding: 0 35px;
}
@media (max-width: 768px) {
  .chat-base-date__chat-window {
    padding: 0;
  }
}
.chat-base-date__chat-window.scrollbar-visible::-webkit-scrollbar {
  display: block;
}
.chat-base-date__chat-window::-webkit-scrollbar {
  width: 12px;
  height: 12px;
  display: none;
}
.chat-base-date__chat-window::-webkit-scrollbar-track {
  background: #939393;
  border-radius: 8px;
}
.chat-base-date__chat-window::-webkit-scrollbar-thumb {
  background: #696969;
  border-radius: 8px;
  border: 2px solid #939393;
}
.chat-base-date__stopped-state {
  width: 100%;
  background: var(--sk-color-second);
  padding: 16px;
  border-radius: 10px;
  margin-bottom: 10px;
}
.chat-base-date__stopped-state.hide {
  display: none;
}
.chat-base-date__stopped-state--title {
  margin-bottom: 10px;
  display: block;
  font-size: 16px;
}
.chat-base-date__stopped-state--text {
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 10px !important;
}
.chat-base-date__stopped-state--list-proccess {
  list-style: none;
  margin: 0;
  padding: 10px 20px;
  background: white;
  border-radius: 10px;
}
.chat-base-date__stopped-state--list-proccess li {
  margin-bottom: 5px;
  font-size: 14px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
}
.chat-base-date__wrapper-search {
  display: none;
  flex-direction: row;
  align-items: center;
  padding: 6px 7px;
  border-radius: 10px;
  background: white;
  width: 100%;
}
.chat-base-date__wrapper-search.show {
  display: flex;
}
.chat-base-date__wrapper-search-text {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  width: 100%;
  padding: 0 10px;
}
.chat-base-date__wrapper-search .ms-search {
  font-weight: 600;
  font-size: 12px;
}
.chat-base-date__wrapper-search .search-text {
  display: inline-block;
  position: relative;
}
.chat-base-date__wrapper-search .search-text::before {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: var(--sk-color-second);
  overflow: hidden;
  animation: animate 2s linear infinite;
  border-right: 2px solid var(--sk-color-second);
}
.chat-base-date__chat-window-result {
  width: 100%;
}
.chat-base-date__chat-window-result .question-wrapper {
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-left: auto;
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}
.chat-base-date__chat-window-result .question-time,
.chat-base-date__chat-window-result .user-name {
  color: var(--sk-color-gray-1);
  font-size: 12px;
  text-align: right;
}
.chat-base-date__chat-window-result .question {
  color: var(--sk-color-white);
  background-color: var(--sk-color-black);
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 8px;
  padding: 14.5px 20px;
  margin-top: 8px;
}
.chat-base-date__chat-window-result .answer-wrapper {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}
.chat-base-date__chat-window-result .answer-wrapper .answer {
  font-size: 14px;
  line-height: 1.4;
}
.chat-base-date__chat-window-result .answer-wrapper .answer-time,
.chat-base-date__chat-window-result .answer-wrapper .ai-name {
  color: var(--sk-color-gray-1);
  font-size: 12px;
}
.chat-base-date__chat-window-result .answer-wrapper .logo-icon-answer {
  margin: 8px 0;
}
.chat-base-date__chat-window-result .book-accordion-wrapper {
  margin-top: 10px;
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-annotation-item {
  display: block;
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-accordion-btn {
  font-weight: 700;
  background: transparent;
  border: none;
  position: relative;
  padding: 10px 40px 10px 10px;
  cursor: pointer;
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-accordion-btn::after {
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  right: 10px;
  top: 7px;
  transition: transform 0.4s ease;
  background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.70711 8.29289C6.31658 7.90237 5.68342 7.90237 5.29289 8.29289C4.90237 8.68342 4.90237 9.31658 5.29289 9.70711L11.2929 15.7071C11.6834 16.0976 12.3166 16.0976 12.7071 15.7071L18.7071 9.70711C19.0976 9.31658 19.0976 8.68342 18.7071 8.29289C18.3166 7.90237 17.6834 7.90237 17.2929 8.29289L12 13.5858L6.70711 8.29289Z" fill="%23202020"/><path d="M6.70711 8.29289C6.31658 7.90237 5.68342 7.90237 5.29289 8.29289C4.90237 8.68342 4.90237 9.31658 5.29289 9.70711L11.2929 15.7071C11.6834 16.0976 12.3166 16.0976 12.7071 15.7071L18.7071 9.70711C19.0976 9.31658 19.0976 8.68342 18.7071 8.29289C18.3166 7.90237 17.6834 7.90237 17.2929 8.29289L12 13.5858L6.70711 8.29289Z" fill="black" fill-opacity="0.2"/></svg>');
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-accordion-btn.active::after {
  transform: rotateX(180deg);
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-content-wrapper {
  height: auto;
  max-height: 0;
  overflow: hidden;
  transition: 0.4s ease;
}
.chat-base-date__chat-window-result .book-accordion-wrapper .books-wrapper {
  height: auto;
  max-height: 0;
  overflow: hidden;
  transition: 0.4s ease;
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-list {
  padding: 0 0 20px 40px;
  margin: 0;
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-list .book-btn {
  background: transparent;
  border: none;
  position: relative;
  padding: 10px 40px 0 4px;
  cursor: pointer;
  font-style: italic;
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-list .book-btn::after {
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  right: 10px;
  top: 7px;
  transition: transform 0.4s ease;
  background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.70711 8.29289C6.31658 7.90237 5.68342 7.90237 5.29289 8.29289C4.90237 8.68342 4.90237 9.31658 5.29289 9.70711L11.2929 15.7071C11.6834 16.0976 12.3166 16.0976 12.7071 15.7071L18.7071 9.70711C19.0976 9.31658 19.0976 8.68342 18.7071 8.29289C18.3166 7.90237 17.6834 7.90237 17.2929 8.29289L12 13.5858L6.70711 8.29289Z" fill="%23202020"/><path d="M6.70711 8.29289C6.31658 7.90237 5.68342 7.90237 5.29289 8.29289C4.90237 8.68342 4.90237 9.31658 5.29289 9.70711L11.2929 15.7071C11.6834 16.0976 12.3166 16.0976 12.7071 15.7071L18.7071 9.70711C19.0976 9.31658 19.0976 8.68342 18.7071 8.29289C18.3166 7.90237 17.6834 7.90237 17.2929 8.29289L12 13.5858L6.70711 8.29289Z" fill="black" fill-opacity="0.2"/></svg>');
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-list .book-btn.active::after {
  transform: rotateX(180deg);
}
.chat-base-date__chat-window-result .book-accordion-wrapper .book-list .book-content-inner {
  color: var(--sk-color-gray-1);
  line-height: 1.4;
  padding: 10px 0 10px 4px;
}
.chat-base-date__chat-form {
  position: relative;
}
.chat-base-date__chat-form-textare {
  border: 1px solid var(--sk-color-border-second);
  padding: 12px 112px 12px 12px;
  margin: 0;
  border-radius: 20px;
}
.chat-base-date__chat-form-btn {
  position: absolute;
  right: 15px;
  bottom: 15px;
  display: flex;
  align-items: center;
  padding: 12px 17px;
  border-radius: 99px;
  background-color: var(--sk-color-black);
  color: var(--sk-color-white);
  border: none;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: opacity 0.4s ease;
  margin: 0;
}
.chat-base-date__chat-form-btn span {
  display: flex;
  align-items: center;
}
.chat-base-date__chat-form-btn span.hidden {
  display: none;
}
.chat-base-date__chat-form-btn:hover {
  opacity: 0.8;
}
.chat-base-date__chat-form-btn svg {
  margin-left: 10px;
}

@keyframes animate {
  0% {
    width: 0;
  }
  50% {
    width: 99%;
  }
  100% {
    width: 0;
  }
}