financial-assistant

1
.assistant__wrapper {
2
  max-width: 1440px;
3
  height: 100vh;
4
  @include flex(
5
    $direction: column,
6
    $justify-content: flex-end,
7
    $align-items: center
8
  );
9
  margin: 0 auto;
10
}
11

12
.assistant__form {
13
  width: 50%;
14
  bottom: 50px;
15
  margin-top: 2rem;
16

17
  @include flex($justify-content: flex-end, $align-items: center, $gap: 1rem);
18
}
19

20
.assistant__textarea {
21
  width: 100%;
22
  height: 6rem;
23
  background-color: unset;
24

25
  border-radius: 10px;
26
  border: 2px solid $color-border;
27
  color: $color-text-light;
28

29
  font: $font-medium;
30
  padding: 10px;
31

32
  overflow: hidden;
33
}
34

35
.assistant__send-button {
36
  width: 10%;
37
  height: 100%;
38
  border-radius: 10px;
39
  background: url("../assets/buttons/sendButton.svg") no-repeat;
40
  background-size: contain;
41

42
  cursor: pointer;
43

44
  &:hover {
45
    transition: all 0.3s ease;
46
    background: url("../assets/buttons/sendButton-filled.svg") no-repeat;
47
    background-size: contain;
48
  }
49
}
50

51
.assistant__dialog {
52
  width: 50%;
53
  margin: 0 auto;
54
  padding: 0 2rem;
55

56
  @include flex($direction: column);
57

58
  overflow-y: scroll;
59
  overflow-x: hidden;
60
  margin-top: 3rem;
61

62
  &::-webkit-scrollbar {
63
    width: 3px;
64
  }
65

66
  &::-webkit-scrollbar-thumb {
67
    background-color: $color-text-light;
68
    border-radius: 5px;
69
  }
70
}
71

72