1  $primaryColor: #012060;
 2  
 3  .CurrencyDropdownRoot {
 4    position: relative;
 5    display: inline-block;
 6    font-family: 'Arial', sans-serif;
 7  }
 8  
 9  .CurrencyDropdownTrigger {
10    width: 100%;
11    padding: 8px 12px;
12    font-size: 16px;
13    border: 2px solid $primaryColor;
14    border-radius: 4px;
15    background-color: white;
16    color: $primaryColor;
17    cursor: pointer;
18    display: flex;
19    align-items: center;
20    justify-content: space-between;
21    box-sizing: border-box;
22    position: relative;
23  
24    &:hover {
25      background-color: #f5f5f5;
26    }
27  }
28  
29  .CurrencyDropdownTrigger::after {
30    content: '\25BE';
31    font-size: 14px;
32    margin-left: 8px;
33  }
34  
35  .CurrencyDropdownContent {
36    background-color: white;
37    border: 2px solid $primaryColor;
38    border-radius: 4px;
39    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
40    padding: 8px;
41    position: relative;
42    z-index: 1000;
43    top: 100%;
44    left: 0;
45    min-width: 100%;
46    box-sizing: border-box;
47  
48    .DropdownMenuItem {
49      padding: 8px;
50      cursor: pointer;
51  
52      &:hover {
53        background-color: #f5f5f5;
54      }
55    }
56  
57    .DropdownMenuItemIndicator {
58      margin-right: 8px;
59    }
60  }
61  
62  .DropdownMenuArrow {
63    position: absolute;
64    top: -8px;
65    left: 50%;
66    transform: translateX(-50%);
67    width: 0;
68    height: 0;
69    border-left: 8px solid transparent;
70    border-right: 8px solid transparent;
71    border-bottom: 8px solid white;
72  }