body {
  padding-top: var(--header-height, 0);
}

.theChat {
  position: relative;
}
.theChat .theChatPadd {
  padding: 1.125rem 1rem;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  height: calc(100vh - 240px);
  /* Subtract footer height */
  min-height: 400px;
  /* Minimum height for usability */
}
.theChat .theChatBox {
  position: relative;
  width: 100%;
  max-width: 367px;
  padding: 0.4375rem 0.5rem;
  margin: 0 auto;
  display: flex;
  /* Add flexbox */
  flex-direction: column;
  /* Stack vertically */
  height: 100%;
  /* Take full height */
}
.theChat .theCScroll {
  flex: 1;
  /* Take remaining space */
  overflow-x: hidden;
  overflow-y: auto;
  /* Change to auto for better behavior */
  margin: 0 0 1rem;
  padding: 0 1rem 0 0;
  /* Remove max-height: 55% */
}
.theChat .theChatUser {
  width: fit-content;
  max-width: 70%;
  border-radius: 0.5rem;
  margin: 0 0 0.9375rem auto;
}
.theChat .theChatUser .theCUPadd {
  padding: 0.5rem 0.9375rem 0.5rem 0.9375rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.theChat .theChatUser .theCUPadd .theCUText {
  flex: 1;
  font-weight: 600;
  font-size: 0.875rem;
  word-break: break-word;
  margin: 0 0 0.5rem;
}
.theChat .theChatUser .theCUPadd .theCUTime {
  width: fit-content;
  font-weight: 500;
  font-size: 0.625rem;
  margin: 0 0 0 1.875rem;
}
.theChat .theChatPlatformSelection {
  width: 100%;
  max-width: 278px;
  border-radius: 0.9375rem;
  margin: 0 auto 0.9375rem 0;
}
.theChat .theChatPlatformSelection .theCUPadd {
  padding: 0.5rem 0.9375rem 0.5rem 0.9375rem;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSPlatform {
  display: flex;
  align-items: center;
  margin: 0 0 1rem;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSPlatform .theChatPSPLogoBox {
  width: 50px;
  padding: 0.9375rem 0.375rem;
  margin: 0 0.9375rem 0 0;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSPlatform .theChatPSPLogoBox .theChatPSPLogo {
  width: 100%;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSPlatform .theChatPSPLogoBox .theChatPSPLogo img {
  width: 100%;
  display: block;
  object-fit: contain;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSPlatform .theChatPSPName {
  flex: 1;
  font-weight: 700;
  font-size: 0.8125rem;
  word-break: break-word;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSText {
  font-weight: 600;
  font-size: 0.8125rem;
  word-break: break-word;
  margin: 0 0 1rem;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSFlexWrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 0.5rem;
  margin: 0 0 0.5rem;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSFlexWrap .theChatPSFWButton {
  width: 48%;
  text-align: center;
  font-weight: 700;
  font-size: 0.875rem;
  border-radius: 0.375rem;
  padding: 0.375rem;
  cursor: pointer;
}
.theChat .theChatPlatformSelection .theCUPadd .theChatPSTime {
  font-weight: 500;
  font-size: 0.625rem;
  text-align: right;
}
.theChat .theChatPlatform {
  width: fit-content;
  max-width: 70%;
  border-radius: 0.5rem;
  margin: 0 auto 0.9375rem 0;
}
.theChat .theChatPlatform .theCUPadd {
  padding: 0.5rem 0.9375rem 0.5rem 0.9375rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.theChat .theChatPlatform .theCUPadd .theCUText {
  flex: 1;
  font-weight: 600;
  font-size: 0.875rem;
  word-break: break-word;
  margin: 0 0 0.5rem;
}
.theChat .theChatPlatform .theCUPadd .theCUTime {
  width: fit-content;
  font-weight: 500;
  font-size: 0.625rem;
  margin: 0 0 0 1.875rem;
}
.theChat .theCAction {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 1rem 0 0;
  margin: 0 1rem 0 0;
  flex-shrink: 0;
  width: 100%;
  /* Prevent shrinking */
}
.theChat .theCAction .theCAUpload svg {
  display: block;
}
.theChat .theCAction .theCASend svg {
  display: block;
}
.theChat .theCAction .theCAForm {
  position: relative;
  padding: 0.75rem 1.25rem;
  background: var(--global-secondary-modal-color);
  border-radius: 0.5rem;
  flex: 1;
  margin: 0 0.6875rem;
}
.theChat .theCAction .theCAForm input {
  width: 100%;
  color: var(--global-primary-text-color);
  font-size: 0.75rem;
  background: transparent;
  outline: none;
  border: none;
}
@media screen and (min-width: 1024px) {
  .theChat .theCAction .theCAForm input {
    font-size: 1rem;
  }
}
.theChat .theCAction .theCAForm input::-webkit-outer-spin-button, .theChat .theCAction .theCAForm input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.theChat .theCAction .theCAForm input::placeholder {
  color: var(--global-secondary-text-color);
  opacity: 1;
}
.theChat .theCAction .theCAForm input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px var(--global-secondary-modal-color) inset !important;
  -webkit-text-fill-color: var(--global-primary-text-color) !important;
}
.theChat .theCAction .theCAForm input[type=number] {
  -moz-appearance: textfield;
}
.theChat .theCAction .theCAForm input[type=date]::-webkit-calendar-picker-indicator {
  opacity: 0;
  cursor: pointer;
  z-index: 1;
}
.theChat .theCAction .theCAForm input[type=date] {
  -moz-appearance: textfield;
}
.theChat .theCAction .theCAForm:-webkit-autofill {
  box-shadow: 0 0 0 1000px var(--global-secondary-modal-color) inset !important;
  -webkit-text-fill-color: var(--global-primary-text-color) !important;
  caret-color: var(--global-secondary-text-color) !important;
}

/*# sourceMappingURL=chat.css.map */