1  @import "common/sass/variables";
 2  
 3  $summary-height: 54px;
 4  $button-break: 'max-width: 620px';
 5  
 6  .ConfModal {
 7    min-width: 580px;
 8  
 9    @media (#{$button-break}) {
10      min-width: 0;
11    }
12  
13    &-summary {
14      display: flex;
15      margin-bottom: 30px;
16  
17      &-icon {
18        height: $summary-height;
19        width: $summary-height;
20        margin: 0 30px;
21      }
22  
23      &-amount {
24        flex-grow: 1;
25        text-align: center;
26        line-height: $summary-height / 2;
27  
28        &-arrow {
29          display: inline-block;
30          height: $summary-height / 3;
31          width: 100%;
32          background-image: url('~assets/images/icon-dot-arrow.svg');
33          background-size: auto 100%;
34          background-repeat: no-repeat;
35          background-position: center;
36        }
37  
38        &-currency {
39          color: color(brand-danger);
40        }
41      }
42    }
43  
44    &-details {
45      padding-left: 30px;
46      margin-bottom: 20px;
47    }
48  
49    &-confirm {
50      text-align: center;
51      font-weight: bold;
52      font-size: $font-size-medium-bump;
53    }
54  
55    &-loading {
56      text-align: center;
57      font-size: $font-size-medium-bump
58    }
59  
60  }
61  
62  // Modal overrides for extra long buttons
63  @media (#{$button-break}) {
64    .ConfModalWrap {
65      .Modal-footer-btn {
66        display: block;
67        float: none;
68        width: 100%;
69        margin: 0 0 5px;
70  
71        &:last-child {
72          margin: 0;
73        }
74      }
75    }
76  }