@dnb/eufemia 9.38.0-beta.1 → 9.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (134) hide show
  1. package/CHANGELOG.md +13 -1
  2. package/cjs/components/lib.d.ts +2 -3
  3. package/cjs/components/table/Table.d.ts +22 -7
  4. package/cjs/components/table/Table.js +14 -3
  5. package/cjs/components/table/TableContainer.d.ts +42 -0
  6. package/cjs/components/table/TableContainer.js +86 -0
  7. package/cjs/components/table/TableScrollView.d.ts +10 -0
  8. package/cjs/components/table/TableScrollView.js +40 -0
  9. package/cjs/components/table/TableStickyHeader.d.ts +2 -2
  10. package/cjs/components/table/TableTd.d.ts +10 -0
  11. package/cjs/components/table/TableTd.js +4 -2
  12. package/cjs/components/table/TableTh.d.ts +1 -0
  13. package/cjs/components/table/TableTh.js +14 -2
  14. package/cjs/components/table/TableTr.d.ts +5 -0
  15. package/cjs/components/table/TableTr.js +3 -2
  16. package/cjs/components/table/style/_table-cell.scss +19 -0
  17. package/cjs/components/table/style/_table-container.scss +61 -0
  18. package/cjs/components/table/style/_table-header-buttons.scss +3 -8
  19. package/cjs/components/table/style/_table-sticky.scss +42 -0
  20. package/cjs/components/table/style/_table-td.scss +119 -0
  21. package/cjs/components/table/style/_table-th.scss +13 -0
  22. package/cjs/components/table/style/_table-tr.scss +31 -0
  23. package/cjs/components/table/style/_table.scss +12 -39
  24. package/cjs/components/table/style/dnb-table.css +234 -49
  25. package/cjs/components/table/style/dnb-table.min.css +2 -2
  26. package/cjs/components/table/style/themes/dnb-table-theme-ui.css +72 -71
  27. package/cjs/components/table/style/themes/dnb-table-theme-ui.min.css +1 -1
  28. package/cjs/components/table/style/themes/dnb-table-theme-ui.scss +71 -51
  29. package/cjs/shared/Eufemia.js +1 -1
  30. package/cjs/style/dnb-ui-components.css +222 -49
  31. package/cjs/style/dnb-ui-components.min.css +2 -2
  32. package/cjs/style/dnb-ui-elements.css +16 -3
  33. package/cjs/style/dnb-ui-elements.min.css +1 -1
  34. package/cjs/style/dnb-ui-tags.css +22 -6
  35. package/cjs/style/dnb-ui-tags.min.css +1 -1
  36. package/cjs/style/elements/_anchor-mixins.scss +8 -4
  37. package/cjs/style/elements/typography.scss +15 -0
  38. package/cjs/style/themes/theme-eiendom/dnb-theme-eiendom.css +88 -74
  39. package/cjs/style/themes/theme-eiendom/dnb-theme-eiendom.min.css +2 -2
  40. package/cjs/style/themes/theme-ui/dnb-theme-ui.css +88 -74
  41. package/cjs/style/themes/theme-ui/dnb-theme-ui.min.css +2 -2
  42. package/components/lib.d.ts +2 -3
  43. package/components/table/Table.d.ts +22 -7
  44. package/components/table/Table.js +8 -3
  45. package/components/table/TableContainer.d.ts +42 -0
  46. package/components/table/TableContainer.js +52 -0
  47. package/components/table/TableScrollView.d.ts +10 -0
  48. package/components/table/TableScrollView.js +15 -0
  49. package/components/table/TableStickyHeader.d.ts +2 -2
  50. package/components/table/TableTd.d.ts +10 -0
  51. package/components/table/TableTd.js +4 -2
  52. package/components/table/TableTh.d.ts +1 -0
  53. package/components/table/TableTh.js +15 -2
  54. package/components/table/TableTr.d.ts +5 -0
  55. package/components/table/TableTr.js +3 -2
  56. package/components/table/style/_table-cell.scss +19 -0
  57. package/components/table/style/_table-container.scss +61 -0
  58. package/components/table/style/_table-header-buttons.scss +3 -8
  59. package/components/table/style/_table-sticky.scss +42 -0
  60. package/components/table/style/_table-td.scss +119 -0
  61. package/components/table/style/_table-th.scss +13 -0
  62. package/components/table/style/_table-tr.scss +31 -0
  63. package/components/table/style/_table.scss +12 -39
  64. package/components/table/style/dnb-table.css +234 -49
  65. package/components/table/style/dnb-table.min.css +2 -2
  66. package/components/table/style/themes/dnb-table-theme-ui.css +72 -71
  67. package/components/table/style/themes/dnb-table-theme-ui.min.css +1 -1
  68. package/components/table/style/themes/dnb-table-theme-ui.scss +71 -51
  69. package/es/components/lib.d.ts +2 -3
  70. package/es/components/table/Table.d.ts +22 -7
  71. package/es/components/table/Table.js +9 -4
  72. package/es/components/table/TableContainer.d.ts +42 -0
  73. package/es/components/table/TableContainer.js +60 -0
  74. package/es/components/table/TableScrollView.d.ts +10 -0
  75. package/es/components/table/TableScrollView.js +17 -0
  76. package/es/components/table/TableStickyHeader.d.ts +2 -2
  77. package/es/components/table/TableTd.d.ts +10 -0
  78. package/es/components/table/TableTd.js +5 -3
  79. package/es/components/table/TableTh.d.ts +1 -0
  80. package/es/components/table/TableTh.js +16 -2
  81. package/es/components/table/TableTr.d.ts +5 -0
  82. package/es/components/table/TableTr.js +3 -2
  83. package/es/components/table/style/_table-cell.scss +19 -0
  84. package/es/components/table/style/_table-container.scss +61 -0
  85. package/es/components/table/style/_table-header-buttons.scss +3 -8
  86. package/es/components/table/style/_table-sticky.scss +42 -0
  87. package/es/components/table/style/_table-td.scss +119 -0
  88. package/es/components/table/style/_table-th.scss +13 -0
  89. package/es/components/table/style/_table-tr.scss +31 -0
  90. package/es/components/table/style/_table.scss +12 -39
  91. package/es/components/table/style/dnb-table.css +234 -49
  92. package/es/components/table/style/dnb-table.min.css +2 -2
  93. package/es/components/table/style/themes/dnb-table-theme-ui.css +72 -71
  94. package/es/components/table/style/themes/dnb-table-theme-ui.min.css +1 -1
  95. package/es/components/table/style/themes/dnb-table-theme-ui.scss +71 -51
  96. package/es/shared/Eufemia.js +1 -1
  97. package/es/style/dnb-ui-components.css +222 -49
  98. package/es/style/dnb-ui-components.min.css +2 -2
  99. package/es/style/dnb-ui-elements.css +16 -3
  100. package/es/style/dnb-ui-elements.min.css +1 -1
  101. package/es/style/dnb-ui-tags.css +22 -6
  102. package/es/style/dnb-ui-tags.min.css +1 -1
  103. package/es/style/elements/_anchor-mixins.scss +8 -4
  104. package/es/style/elements/typography.scss +15 -0
  105. package/es/style/themes/theme-eiendom/dnb-theme-eiendom.css +88 -74
  106. package/es/style/themes/theme-eiendom/dnb-theme-eiendom.min.css +2 -2
  107. package/es/style/themes/theme-ui/dnb-theme-ui.css +88 -74
  108. package/es/style/themes/theme-ui/dnb-theme-ui.min.css +2 -2
  109. package/esm/dnb-ui-basis.min.mjs +1 -1
  110. package/esm/dnb-ui-components.min.mjs +1 -1
  111. package/esm/dnb-ui-elements.min.mjs +2 -2
  112. package/esm/dnb-ui-extensions.min.mjs +1 -1
  113. package/esm/dnb-ui-lib.min.mjs +2 -2
  114. package/esm/dnb-ui-web-components.min.mjs +2 -2
  115. package/package.json +1 -1
  116. package/shared/Eufemia.js +1 -1
  117. package/style/dnb-ui-components.css +222 -49
  118. package/style/dnb-ui-components.min.css +2 -2
  119. package/style/dnb-ui-elements.css +16 -3
  120. package/style/dnb-ui-elements.min.css +1 -1
  121. package/style/dnb-ui-tags.css +22 -6
  122. package/style/dnb-ui-tags.min.css +1 -1
  123. package/style/elements/_anchor-mixins.scss +8 -4
  124. package/style/elements/typography.scss +15 -0
  125. package/style/themes/theme-eiendom/dnb-theme-eiendom.css +88 -74
  126. package/style/themes/theme-eiendom/dnb-theme-eiendom.min.css +2 -2
  127. package/style/themes/theme-ui/dnb-theme-ui.css +88 -74
  128. package/style/themes/theme-ui/dnb-theme-ui.min.css +2 -2
  129. package/umd/dnb-ui-basis.min.js +1 -1
  130. package/umd/dnb-ui-components.min.js +1 -1
  131. package/umd/dnb-ui-elements.min.js +3 -3
  132. package/umd/dnb-ui-extensions.min.js +1 -1
  133. package/umd/dnb-ui-lib.min.js +2 -2
  134. package/umd/dnb-ui-web-components.min.js +2 -2
@@ -0,0 +1,119 @@
1
+ /*
2
+ * Table component
3
+ *
4
+ */
5
+
6
+ @import './_table-header-buttons.scss';
7
+
8
+ @mixin tableBorder {
9
+ content: '';
10
+ position: absolute;
11
+ top: 0;
12
+ left: 0;
13
+ right: 0;
14
+ bottom: 0;
15
+ z-index: -1;
16
+
17
+ pointer-events: none;
18
+ }
19
+
20
+ .dnb-table {
21
+ // table border
22
+ --border: 0.0625rem solid var(--color-black-8);
23
+ &--border tbody &__td {
24
+ z-index: 2; // ensure border is behind content
25
+
26
+ &::after {
27
+ @include tableBorder();
28
+
29
+ border: var(--border);
30
+ border-right: none;
31
+ border-bottom: none;
32
+ }
33
+
34
+ &:first-of-type::after {
35
+ border-left: none;
36
+ }
37
+ }
38
+ &:not(#{&}--outline) tbody &__tr:last-of-type &__td::after {
39
+ border-bottom: var(--border);
40
+ }
41
+
42
+ // table outline
43
+ --outline: 0.0625rem solid var(--color-black-8);
44
+ &--outline thead &__th {
45
+ z-index: 2; // ensure border is behind content
46
+
47
+ &::after {
48
+ @include tableBorder();
49
+
50
+ border-top: var(--outline);
51
+ }
52
+
53
+ &:first-of-type::after {
54
+ border-left: var(--outline);
55
+ }
56
+ &:last-of-type::after {
57
+ border-right: var(--outline);
58
+ }
59
+ }
60
+ &--outline tbody &__td {
61
+ z-index: 2; // ensure border is behind content
62
+
63
+ &:first-of-type::after,
64
+ &:last-of-type::after {
65
+ @include tableBorder();
66
+ }
67
+
68
+ &:first-of-type::after {
69
+ border-left: var(--outline);
70
+ }
71
+ &:last-of-type::after {
72
+ border-right: var(--outline);
73
+ }
74
+ }
75
+ &--outline tbody &__tr:last-of-type &__td {
76
+ z-index: 2; // ensure border is behind content
77
+
78
+ &::after {
79
+ @include tableBorder();
80
+
81
+ border-bottom: var(--outline);
82
+ }
83
+ }
84
+ &--outline thead &__th:first-of-type {
85
+ &,
86
+ &::after {
87
+ border-radius: 0.5rem 0 0 0;
88
+ }
89
+ }
90
+ &--outline thead &__th:last-of-type {
91
+ &,
92
+ &::after {
93
+ border-radius: 0 0.5rem 0 0;
94
+ }
95
+ }
96
+ &--outline tbody &__tr:last-of-type &__td:first-of-type {
97
+ &,
98
+ &::after {
99
+ border-radius: 0 0 0 0.5rem;
100
+ }
101
+ }
102
+ &--outline tbody &__tr:last-of-type &__td:last-of-type {
103
+ &,
104
+ &::after {
105
+ border-radius: 0 0 0.5rem 0;
106
+ }
107
+ }
108
+
109
+ // spacing
110
+ &__td--no-spacing,
111
+ td#{&}__td--no-spacing {
112
+ padding: 0;
113
+ }
114
+ &__td--spacing-horizontal,
115
+ td#{&}__td--spacing-horizontal {
116
+ padding-top: 0;
117
+ padding-bottom: 0;
118
+ }
119
+ }
@@ -0,0 +1,13 @@
1
+ /*
2
+ * Table component
3
+ *
4
+ */
5
+
6
+ @import './_table-header-buttons.scss';
7
+
8
+ .dnb-table {
9
+ &__th__horizontal {
10
+ display: flex;
11
+ align-items: flex-end; // bottom align help-button or other additional elements
12
+ }
13
+ }
@@ -0,0 +1,31 @@
1
+ /*
2
+ * Table component
3
+ *
4
+ */
5
+
6
+ @import './_table-header-buttons.scss';
7
+
8
+ .dnb-table {
9
+ // Needs a double & & for specificity
10
+ & > tbody > tr,
11
+ & &__tr,
12
+ & &__tr--even {
13
+ background-color: var(--color-black-3);
14
+ }
15
+
16
+ // Needs a double & & for specificity
17
+ & > tbody > tr:not(#{&}__tr--even):nth-of-type(2n),
18
+ & &__tr:not(#{&}__tr--even):nth-of-type(2n),
19
+ & &__tr--odd {
20
+ background-color: var(--color-white);
21
+ }
22
+
23
+ &--outline thead &__tr:first-of-type {
24
+ // use clip-path, because border-radius does not clip on tr's
25
+ clip-path: inset(0 round 0.5rem 0.5rem 0 0);
26
+ }
27
+ &--outline tbody &__tr:last-of-type {
28
+ // use clip-path, because border-radius does not clip on tr's
29
+ clip-path: inset(0 round 0 0 0.5rem 0.5rem);
30
+ }
31
+ }
@@ -4,6 +4,12 @@
4
4
  */
5
5
 
6
6
  @import './_table-header-buttons.scss';
7
+ @import './_table-th.scss';
8
+ @import './_table-td.scss';
9
+ @import './_table-tr.scss';
10
+ @import './_table-cell.scss';
11
+ @import './_table-sticky.scss';
12
+ @import './_table-container.scss';
7
13
 
8
14
  .dnb-table {
9
15
  display: table;
@@ -12,20 +18,18 @@
12
18
 
13
19
  overflow: auto;
14
20
  margin-top: 0;
15
- margin-bottom: var(--spacing-small);
21
+ margin-bottom: 0.5rem; // give room to a scrollbar
16
22
 
17
23
  border-spacing: 0;
18
24
  border-collapse: collapse;
19
25
 
20
26
  &--fixed {
21
27
  table-layout: fixed;
28
+ width: auto;
22
29
  }
23
30
 
24
- &__sticky-helper > td {
25
- display: block;
26
- overflow: hidden;
27
- padding: 0 !important;
28
- height: 0;
31
+ &--no-wrap {
32
+ white-space: nowrap;
29
33
  }
30
34
 
31
35
  // deprecated – can be removed in v10
@@ -41,41 +45,10 @@
41
45
  }
42
46
 
43
47
  & > caption {
44
- font-size: var(--font-size-small);
45
-
46
- margin-top: var(--spacing-x-small);
47
48
  caption-side: bottom;
48
- }
49
+ margin-top: 0.5rem;
49
50
 
50
- /* stylelint-disable-next-line */
51
-
52
- tr.sticky th {
53
- position: sticky;
54
- top: var(--table-top, 0); // is set by "stickyOffset" prop
55
- z-index: 2;
56
-
57
- &::before {
58
- content: '';
59
- position: absolute;
60
- opacity: 0;
61
- left: 0;
62
- right: 0;
63
- bottom: 0;
64
- height: 6px;
65
-
66
- // The @mixin defaultDropShadow() does not work in this case
67
- // because we need only a bottom shadow (with clip-path)
68
- box-shadow: var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);
69
- clip-path: inset(6px 0 -48px 0);
70
-
71
- transition: opacity 300ms ease-out;
72
- [data-visual-test-wrapper] & {
73
- transition: none;
74
- }
75
- }
76
- }
77
- tr.sticky.show-shadow th::before {
78
- opacity: 1;
51
+ font-size: var(--font-size-basis);
79
52
  }
80
53
 
81
54
  /* stylelint-disable */
@@ -76,26 +76,242 @@
76
76
  * Button mixins
77
77
  *
78
78
  */
79
+ /*
80
+ * Table component
81
+ *
82
+ */
83
+ /*
84
+ * Button mixins
85
+ *
86
+ */
87
+ .dnb-table__th__horizontal {
88
+ display: -webkit-box;
89
+ display: -ms-flexbox;
90
+ display: flex;
91
+ -webkit-box-align: end;
92
+ -ms-flex-align: end;
93
+ align-items: flex-end; }
94
+
95
+ /*
96
+ * Table component
97
+ *
98
+ */
99
+ /*
100
+ * Button mixins
101
+ *
102
+ */
103
+ .dnb-table {
104
+ --border: 0.0625rem solid var(--color-black-8);
105
+ --outline: 0.0625rem solid var(--color-black-8); }
106
+ .dnb-table--border tbody .dnb-table__td {
107
+ z-index: 2; }
108
+ .dnb-table--border tbody .dnb-table__td::after {
109
+ content: '';
110
+ position: absolute;
111
+ top: 0;
112
+ left: 0;
113
+ right: 0;
114
+ bottom: 0;
115
+ z-index: -1;
116
+ pointer-events: none;
117
+ border: var(--border);
118
+ border-right: none;
119
+ border-bottom: none; }
120
+ .dnb-table--border tbody .dnb-table__td:first-of-type::after {
121
+ border-left: none; }
122
+ .dnb-table:not(.dnb-table--outline) tbody .dnb-table__tr:last-of-type .dnb-table__td::after {
123
+ border-bottom: var(--border); }
124
+ .dnb-table--outline thead .dnb-table__th {
125
+ z-index: 2; }
126
+ .dnb-table--outline thead .dnb-table__th::after {
127
+ content: '';
128
+ position: absolute;
129
+ top: 0;
130
+ left: 0;
131
+ right: 0;
132
+ bottom: 0;
133
+ z-index: -1;
134
+ pointer-events: none;
135
+ border-top: var(--outline); }
136
+ .dnb-table--outline thead .dnb-table__th:first-of-type::after {
137
+ border-left: var(--outline); }
138
+ .dnb-table--outline thead .dnb-table__th:last-of-type::after {
139
+ border-right: var(--outline); }
140
+ .dnb-table--outline tbody .dnb-table__td {
141
+ z-index: 2; }
142
+ .dnb-table--outline tbody .dnb-table__td:first-of-type::after, .dnb-table--outline tbody .dnb-table__td:last-of-type::after {
143
+ content: '';
144
+ position: absolute;
145
+ top: 0;
146
+ left: 0;
147
+ right: 0;
148
+ bottom: 0;
149
+ z-index: -1;
150
+ pointer-events: none; }
151
+ .dnb-table--outline tbody .dnb-table__td:first-of-type::after {
152
+ border-left: var(--outline); }
153
+ .dnb-table--outline tbody .dnb-table__td:last-of-type::after {
154
+ border-right: var(--outline); }
155
+ .dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td {
156
+ z-index: 2; }
157
+ .dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td::after {
158
+ content: '';
159
+ position: absolute;
160
+ top: 0;
161
+ left: 0;
162
+ right: 0;
163
+ bottom: 0;
164
+ z-index: -1;
165
+ pointer-events: none;
166
+ border-bottom: var(--outline); }
167
+ .dnb-table--outline thead .dnb-table__th:first-of-type, .dnb-table--outline thead .dnb-table__th:first-of-type::after {
168
+ border-radius: 0.5rem 0 0 0; }
169
+ .dnb-table--outline thead .dnb-table__th:last-of-type, .dnb-table--outline thead .dnb-table__th:last-of-type::after {
170
+ border-radius: 0 0.5rem 0 0; }
171
+ .dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:first-of-type, .dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:first-of-type::after {
172
+ border-radius: 0 0 0 0.5rem; }
173
+ .dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:last-of-type, .dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:last-of-type::after {
174
+ border-radius: 0 0 0.5rem 0; }
175
+ .dnb-table__td--no-spacing,
176
+ .dnb-table td.dnb-table__td--no-spacing {
177
+ padding: 0; }
178
+ .dnb-table__td--spacing-horizontal,
179
+ .dnb-table td.dnb-table__td--spacing-horizontal {
180
+ padding-top: 0;
181
+ padding-bottom: 0; }
182
+
183
+ /*
184
+ * Table component
185
+ *
186
+ */
187
+ /*
188
+ * Button mixins
189
+ *
190
+ */
191
+ .dnb-table > tbody > tr,
192
+ .dnb-table .dnb-table__tr,
193
+ .dnb-table .dnb-table__tr--even {
194
+ background-color: #f8f8f8;
195
+ background-color: var(--color-black-3); }
196
+
197
+ .dnb-table > tbody > tr:not(.dnb-table__tr--even):nth-of-type(2n),
198
+ .dnb-table .dnb-table__tr:not(.dnb-table__tr--even):nth-of-type(2n),
199
+ .dnb-table .dnb-table__tr--odd {
200
+ background-color: #fff;
201
+ background-color: var(--color-white); }
202
+
203
+ .dnb-table--outline thead .dnb-table__tr:first-of-type {
204
+ -webkit-clip-path: inset(0 round 0.5rem 0.5rem 0 0);
205
+ clip-path: inset(0 round 0.5rem 0.5rem 0 0); }
206
+
207
+ .dnb-table--outline tbody .dnb-table__tr:last-of-type {
208
+ -webkit-clip-path: inset(0 round 0 0 0.5rem 0.5rem);
209
+ clip-path: inset(0 round 0 0 0.5rem 0.5rem); }
210
+
211
+ /*
212
+ * Table component
213
+ *
214
+ */
215
+ .dnb-table > tr > th,
216
+ .dnb-table > tr > td,
217
+ .dnb-table > thead > tr > th,
218
+ .dnb-table > tbody > tr > td, .dnb-table__th, .dnb-table__td {
219
+ position: relative;
220
+ border-spacing: 0;
221
+ word-break: keep-all; }
222
+
223
+ /*
224
+ * Table component
225
+ *
226
+ */
227
+ .dnb-table__sticky-helper > td {
228
+ display: block;
229
+ overflow: hidden;
230
+ padding: 0 !important;
231
+ height: 0; }
232
+
233
+ .dnb-table tr.sticky th {
234
+ position: sticky;
235
+ top: 0;
236
+ top: var(--table-top, 0);
237
+ z-index: 2; }
238
+ .dnb-table tr.sticky th::before {
239
+ content: '';
240
+ position: absolute;
241
+ opacity: 0;
242
+ left: 0;
243
+ right: 0;
244
+ bottom: 0;
245
+ height: 6px;
246
+ -webkit-box-shadow: 0 -2px 12px 8px rgba(51, 51, 51, 0.08);
247
+ box-shadow: 0 -2px 12px 8px rgba(51, 51, 51, 0.08);
248
+ -webkit-box-shadow: var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);
249
+ box-shadow: var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);
250
+ -webkit-clip-path: inset(6px 0 -48px 0);
251
+ clip-path: inset(6px 0 -48px 0);
252
+ -webkit-transition: opacity 300ms ease-out;
253
+ transition: opacity 300ms ease-out; }
254
+ [data-visual-test-wrapper] .dnb-table tr.sticky th::before {
255
+ -webkit-transition: none;
256
+ transition: none; }
257
+
258
+ .dnb-table tr.sticky.show-shadow th::before {
259
+ opacity: 1; }
260
+
261
+ /*
262
+ * Table component
263
+ *
264
+ */
265
+ .dnb-table__container {
266
+ position: relative;
267
+ --border: 0.0625rem solid var(--color-black-8);
268
+ background-color: #fff;
269
+ background-color: var(--color-white); }
270
+ .dnb-table__container::after {
271
+ content: '';
272
+ position: absolute;
273
+ top: 0;
274
+ left: 0;
275
+ right: 0;
276
+ bottom: 0;
277
+ z-index: 1;
278
+ pointer-events: none;
279
+ border: var(--border); }
280
+ .dnb-table__container, .dnb-table__container::after {
281
+ border-radius: 0.5rem; }
282
+ .dnb-table__container, .dnb-table__container__body, .dnb-table__container__head, .dnb-table__container__foot {
283
+ display: -webkit-box;
284
+ display: -ms-flexbox;
285
+ display: flex;
286
+ -webkit-box-orient: vertical;
287
+ -webkit-box-direction: normal;
288
+ -ms-flex-direction: column;
289
+ flex-direction: column; }
290
+ .dnb-table__container__body .dnb-table:not([class*='space__bottom']) {
291
+ margin-bottom: 0; }
292
+ .dnb-table__container__head {
293
+ padding: 2rem 1rem 0; }
294
+ .dnb-spacing .dnb-table__container__head .dnb-h--large:not([class*='space__top']) {
295
+ margin: 0; }
296
+ .dnb-table__container__foot {
297
+ padding: 0.5rem 1rem 2rem; }
298
+
79
299
  .dnb-table {
80
300
  display: table;
81
301
  table-layout: auto;
82
302
  width: 100%;
83
303
  overflow: auto;
84
304
  margin-top: 0;
85
- margin-bottom: 1rem;
86
- margin-bottom: var(--spacing-small);
305
+ margin-bottom: 0.5rem;
87
306
  border-spacing: 0;
88
307
  border-collapse: collapse;
89
- /* stylelint-disable-next-line */
90
308
  /* stylelint-disable */
91
309
  /* stylelint-enable */ }
92
310
  .dnb-table--fixed {
93
- table-layout: fixed; }
94
- .dnb-table__sticky-helper > td {
95
- display: block;
96
- overflow: hidden;
97
- padding: 0 !important;
98
- height: 0; }
311
+ table-layout: fixed;
312
+ width: auto; }
313
+ .dnb-table--no-wrap {
314
+ white-space: nowrap; }
99
315
  .dnb-table, .dnb-table--left {
100
316
  text-align: left; }
101
317
  .dnb-table--right {
@@ -103,37 +319,10 @@
103
319
  .dnb-table--center {
104
320
  text-align: center; }
105
321
  .dnb-table > caption {
106
- font-size: 1rem;
107
- font-size: var(--font-size-small);
322
+ caption-side: bottom;
108
323
  margin-top: 0.5rem;
109
- margin-top: var(--spacing-x-small);
110
- caption-side: bottom; }
111
- .dnb-table tr.sticky th {
112
- position: sticky;
113
- top: 0;
114
- top: var(--table-top, 0);
115
- z-index: 2; }
116
- .dnb-table tr.sticky th::before {
117
- content: '';
118
- position: absolute;
119
- opacity: 0;
120
- left: 0;
121
- right: 0;
122
- bottom: 0;
123
- height: 6px;
124
- -webkit-box-shadow: 0 -2px 12px 8px rgba(51, 51, 51, 0.08);
125
- box-shadow: 0 -2px 12px 8px rgba(51, 51, 51, 0.08);
126
- -webkit-box-shadow: var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);
127
- box-shadow: var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);
128
- -webkit-clip-path: inset(6px 0 -48px 0);
129
- clip-path: inset(6px 0 -48px 0);
130
- -webkit-transition: opacity 300ms ease-out;
131
- transition: opacity 300ms ease-out; }
132
- [data-visual-test-wrapper] .dnb-table tr.sticky th::before {
133
- -webkit-transition: none;
134
- transition: none; }
135
- .dnb-table tr.sticky.show-shadow th::before {
136
- opacity: 1; }
324
+ font-size: 1.125rem;
325
+ font-size: var(--font-size-basis); }
137
326
  .dnb-table--small,
138
327
  .dnb-table--small > tr > th,
139
328
  .dnb-table--small > tr > td,
@@ -177,8 +366,8 @@
177
366
  -webkit-text-fill-color: var(--skeleton-color); }
178
367
  .dnb-table > thead > tr > th.dnb-table--sortable,
179
368
  .dnb-table .dnb-table__th.dnb-table--sortable {
180
- color: #14555a;
181
- color: var(--color-emerald-green); }
369
+ color: #007272;
370
+ color: var(--color-sea-green); }
182
371
  .dnb-table > thead > tr > th.dnb-table--sortable .dnb-table__sort-button.dnb-button,
183
372
  .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button {
184
373
  position: relative;
@@ -225,8 +414,8 @@
225
414
  .dnb-table > thead > tr > th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text::after,
226
415
  .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text::after {
227
416
  opacity: 1;
228
- color: #14555a;
229
- color: var(--color-emerald-green); }
417
+ color: #007272;
418
+ color: var(--color-sea-green); }
230
419
  html:not([data-whatintent='touch']) .dnb-table > thead > tr > th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled], html:not([data-whatintent='touch'])
231
420
  .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled] {
232
421
  cursor: not-allowed; }
@@ -280,8 +469,8 @@
280
469
  .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),
281
470
  html:not([data-whatintent='touch'])
282
471
  .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]) {
283
- color: #14555a;
284
- color: var(--color-emerald-green); }
472
+ color: #007272;
473
+ color: var(--color-sea-green); }
285
474
  .dnb-table > thead > tr > th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled])::before,
286
475
  html:not([data-whatintent='touch']) .dnb-table > thead > tr > th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled])::before,
287
476
  .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled])::before,
@@ -416,10 +605,6 @@ thead > tr > th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus
416
605
  transform: rotate(180deg);
417
606
  -webkit-transform-origin: 50% 50%;
418
607
  transform-origin: 50% 50%; }
419
- .dnb-table > thead > tr > th.dnb-table--no-wrap,
420
- .dnb-table > tbody > tr > th.dnb-table--no-wrap,
421
- .dnb-table .dnb-table__th.dnb-table--no-wrap {
422
- white-space: nowrap; }
423
608
  .dnb-table .dnb-table__th .dnb-table__help-button,
424
609
  .dnb-table > thead > tr > th .dnb-table__help-button {
425
610
  margin-left: 0.5rem; }
@@ -1,2 +1,2 @@
1
- .dnb-table{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-size:1rem;font-size:var(--font-size-small);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-table *,.dnb-table :after,.dnb-table :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-table :after,.dnb-table :before{text-decoration:inherit;vertical-align:inherit}.dnb-table{border-collapse:collapse;border-spacing:0;display:table;margin-bottom:1rem;margin-bottom:var(--spacing-small);margin-top:0;overflow:auto;table-layout:auto;width:100%}.dnb-table--fixed{table-layout:fixed}.dnb-table__sticky-helper>td{display:block;height:0;overflow:hidden;padding:0!important}.dnb-table,.dnb-table--left{text-align:left}.dnb-table--right{text-align:right}.dnb-table--center{text-align:center}.dnb-table>caption{caption-side:bottom;font-size:1rem;font-size:var(--font-size-small);margin-top:.5rem;margin-top:var(--spacing-x-small)}.dnb-table tr.sticky th{position:sticky;top:0;top:var(--table-top,0);z-index:2}.dnb-table tr.sticky th:before{bottom:0;-webkit-box-shadow:0 -2px 12px 8px rgba(51,51,51,.08);box-shadow:0 -2px 12px 8px rgba(51,51,51,.08);-webkit-box-shadow:var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);box-shadow:var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);-webkit-clip-path:inset(6px 0 -48px 0);clip-path:inset(6px 0 -48px 0);content:"";height:6px;left:0;opacity:0;position:absolute;right:0;-webkit-transition:opacity .3s ease-out;transition:opacity .3s ease-out}[data-visual-test-wrapper] .dnb-table tr.sticky th:before{-webkit-transition:none;transition:none}.dnb-table tr.sticky.show-shadow th:before{opacity:1}.dnb-table--small,.dnb-table--small>tbody>tr>td,.dnb-table--small>thead>tr>th,.dnb-table--small>tr>td,.dnb-table--small>tr>th,.dnb-table>tbody>tr.dnb-table--small>td,.dnb-table>tbody>tr>td.dnb-table--small,.dnb-table>thead>tr.dnb-table--small>th,.dnb-table>thead>tr>th.dnb-table--small,.dnb-table>tr.dnb-table--small>td,.dnb-table>tr.dnb-table--small>th,.dnb-table>tr>td.dnb-table--small,.dnb-table>tr>th.dnb-table--small,.dnb-table__td.dnb-table--small,.dnb-table__th.dnb-table--small{font-size:1rem;font-size:var(--font-size-small)}.dnb-table--x-small,.dnb-table--x-small>tbody>tr>td,.dnb-table--x-small>thead>tr>th,.dnb-table--x-small>tr>td,.dnb-table--x-small>tr>th,.dnb-table>tbody>tr.dnb-table--x-small>td,.dnb-table>tbody>tr>td.dnb-table--x-small,.dnb-table>thead>tr.dnb-table--x-small>th,.dnb-table>thead>tr>th.dnb-table--x-small,.dnb-table>tr.dnb-table--x-small>td,.dnb-table>tr.dnb-table--x-small>th,.dnb-table>tr>td.dnb-table--x-small,.dnb-table>tr>th.dnb-table--x-small,.dnb-table__td.dnb-table--x-small,.dnb-table__th.dnb-table--x-small{font-size:.875rem;font-size:var(--font-size-x-small)}.dnb-table.dnb-skeleton>*{-webkit-text-fill-color:#ebebeb;-webkit-text-fill-color:var(--skeleton-color)}.dnb-table .dnb-table__th.dnb-table--sortable,.dnb-table>thead>tr>th.dnb-table--sortable{color:#14555a;color:var(--color-emerald-green)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-shadow:none;box-shadow:none;color:inherit;font-size:inherit;font-weight:500;font-weight:var(--font-weight-medium);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0 .5rem 0 0;position:relative;text-align:inherit;z-index:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{opacity:0;-webkit-transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out,-webkit-transform .5s ease-out}[data-visual-test-wrapper] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,[data-visual-test-wrapper] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{-webkit-transition:none;transition:none}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text{font-size:inherit;margin:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after{right:1rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon{-ms-flex-item-align:end;align-self:flex-end;margin-bottom:.25rem;margin-top:auto}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after{color:#14555a;color:var(--color-emerald-green);opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]){color:#007272;color:var(--color-sea-green)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon{opacity:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]){color:#14555a;color:var(--color-emerald-green)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;height:inherit;left:-.5rem;outline:none;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--sortable[align=right],.dnb-table>thead>tr>th.dnb-table--sortable[align=right]{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text{padding-right:0}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after{right:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{color:#007272;color:var(--color-sea-green);opacity:1}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:visible}html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard]
2
- .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transform-origin:50% 50%;transform-origin:50% 50%}.dnb-table .dnb-table__th.dnb-table--no-wrap,.dnb-table>tbody>tr>th.dnb-table--no-wrap,.dnb-table>thead>tr>th.dnb-table--no-wrap{white-space:nowrap}.dnb-table .dnb-table__th .dnb-table__help-button,.dnb-table>thead>tr>th .dnb-table__help-button{margin-left:.5rem}.dnb-spacing .dnb-table dl,.dnb-spacing .dnb-table ol,.dnb-spacing .dnb-table p,.dnb-spacing .dnb-table pre,.dnb-spacing .dnb-table ul{margin-bottom:0;margin-top:0}
1
+ .dnb-table{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-size:1rem;font-size:var(--font-size-small);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-table *,.dnb-table :after,.dnb-table :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-table :after,.dnb-table :before{text-decoration:inherit;vertical-align:inherit}.dnb-table__th__horizontal{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;display:-webkit-box;display:-ms-flexbox;display:flex}.dnb-table{--border:0.0625rem solid var(--color-black-8);--outline:0.0625rem solid var(--color-black-8)}.dnb-table--border tbody .dnb-table__td{z-index:2}.dnb-table--border tbody .dnb-table__td:after{border:var(--border);border-bottom:none;border-right:none;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:-1}.dnb-table--border tbody .dnb-table__td:first-of-type:after{border-left:none}.dnb-table:not(.dnb-table--outline) tbody .dnb-table__tr:last-of-type .dnb-table__td:after{border-bottom:var(--border)}.dnb-table--outline thead .dnb-table__th{z-index:2}.dnb-table--outline thead .dnb-table__th:after{border-top:var(--outline);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:-1}.dnb-table--outline thead .dnb-table__th:first-of-type:after{border-left:var(--outline)}.dnb-table--outline thead .dnb-table__th:last-of-type:after{border-right:var(--outline)}.dnb-table--outline tbody .dnb-table__td{z-index:2}.dnb-table--outline tbody .dnb-table__td:first-of-type:after,.dnb-table--outline tbody .dnb-table__td:last-of-type:after{bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:-1}.dnb-table--outline tbody .dnb-table__td:first-of-type:after{border-left:var(--outline)}.dnb-table--outline tbody .dnb-table__td:last-of-type:after{border-right:var(--outline)}.dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td{z-index:2}.dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:after{border-bottom:var(--outline);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:-1}.dnb-table--outline thead .dnb-table__th:first-of-type,.dnb-table--outline thead .dnb-table__th:first-of-type:after{border-radius:.5rem 0 0 0}.dnb-table--outline thead .dnb-table__th:last-of-type,.dnb-table--outline thead .dnb-table__th:last-of-type:after{border-radius:0 .5rem 0 0}.dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:first-of-type,.dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:first-of-type:after{border-radius:0 0 0 .5rem}.dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:last-of-type,.dnb-table--outline tbody .dnb-table__tr:last-of-type .dnb-table__td:last-of-type:after{border-radius:0 0 .5rem 0}.dnb-table__td--no-spacing,.dnb-table td.dnb-table__td--no-spacing{padding:0}.dnb-table__td--spacing-horizontal,.dnb-table td.dnb-table__td--spacing-horizontal{padding-bottom:0;padding-top:0}.dnb-table .dnb-table__tr,.dnb-table .dnb-table__tr--even,.dnb-table>tbody>tr{background-color:#f8f8f8;background-color:var(--color-black-3)}.dnb-table .dnb-table__tr--odd,.dnb-table .dnb-table__tr:not(.dnb-table__tr--even):nth-of-type(2n),.dnb-table>tbody>tr:not(.dnb-table__tr--even):nth-of-type(2n){background-color:#fff;background-color:var(--color-white)}.dnb-table--outline thead .dnb-table__tr:first-of-type{-webkit-clip-path:inset(0 round .5rem .5rem 0 0);clip-path:inset(0 round .5rem .5rem 0 0)}.dnb-table--outline tbody .dnb-table__tr:last-of-type{-webkit-clip-path:inset(0 round 0 0 .5rem .5rem);clip-path:inset(0 round 0 0 .5rem .5rem)}.dnb-table>tbody>tr>td,.dnb-table>thead>tr>th,.dnb-table>tr>td,.dnb-table>tr>th,.dnb-table__td,.dnb-table__th{border-spacing:0;position:relative;word-break:keep-all}.dnb-table__sticky-helper>td{display:block;height:0;overflow:hidden;padding:0!important}.dnb-table tr.sticky th{position:sticky;top:0;top:var(--table-top,0);z-index:2}.dnb-table tr.sticky th:before{bottom:0;-webkit-box-shadow:0 -2px 12px 8px rgba(51,51,51,.08);box-shadow:0 -2px 12px 8px rgba(51,51,51,.08);-webkit-box-shadow:var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);box-shadow:var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);-webkit-clip-path:inset(6px 0 -48px 0);clip-path:inset(6px 0 -48px 0);content:"";height:6px;left:0;opacity:0;position:absolute;right:0;-webkit-transition:opacity .3s ease-out;transition:opacity .3s ease-out}[data-visual-test-wrapper] .dnb-table tr.sticky th:before{-webkit-transition:none;transition:none}.dnb-table tr.sticky.show-shadow th:before{opacity:1}.dnb-table__container{--border:0.0625rem solid var(--color-black-8);background-color:#fff;background-color:var(--color-white);position:relative}.dnb-table__container:after{border:var(--border);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1}.dnb-table__container,.dnb-table__container:after{border-radius:.5rem}.dnb-table__container,.dnb-table__container__body,.dnb-table__container__foot,.dnb-table__container__head{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.dnb-table__container__body .dnb-table:not([class*=space__bottom]){margin-bottom:0}.dnb-table__container__head{padding:2rem 1rem 0}.dnb-spacing .dnb-table__container__head .dnb-h--large:not([class*=space__top]){margin:0}.dnb-table__container__foot{padding:.5rem 1rem 2rem}.dnb-table{border-collapse:collapse;border-spacing:0;display:table;margin-bottom:.5rem;margin-top:0;overflow:auto;table-layout:auto;width:100%}.dnb-table--fixed{table-layout:fixed;width:auto}.dnb-table--no-wrap{white-space:nowrap}.dnb-table,.dnb-table--left{text-align:left}.dnb-table--right{text-align:right}.dnb-table--center{text-align:center}.dnb-table>caption{caption-side:bottom;font-size:1.125rem;font-size:var(--font-size-basis);margin-top:.5rem}.dnb-table--small,.dnb-table--small>tbody>tr>td,.dnb-table--small>thead>tr>th,.dnb-table--small>tr>td,.dnb-table--small>tr>th,.dnb-table>tbody>tr.dnb-table--small>td,.dnb-table>tbody>tr>td.dnb-table--small,.dnb-table>thead>tr.dnb-table--small>th,.dnb-table>thead>tr>th.dnb-table--small,.dnb-table>tr.dnb-table--small>td,.dnb-table>tr.dnb-table--small>th,.dnb-table>tr>td.dnb-table--small,.dnb-table>tr>th.dnb-table--small,.dnb-table__td.dnb-table--small,.dnb-table__th.dnb-table--small{font-size:1rem;font-size:var(--font-size-small)}.dnb-table--x-small,.dnb-table--x-small>tbody>tr>td,.dnb-table--x-small>thead>tr>th,.dnb-table--x-small>tr>td,.dnb-table--x-small>tr>th,.dnb-table>tbody>tr.dnb-table--x-small>td,.dnb-table>tbody>tr>td.dnb-table--x-small,.dnb-table>thead>tr.dnb-table--x-small>th,.dnb-table>thead>tr>th.dnb-table--x-small,.dnb-table>tr.dnb-table--x-small>td,.dnb-table>tr.dnb-table--x-small>th,.dnb-table>tr>td.dnb-table--x-small,.dnb-table>tr>th.dnb-table--x-small,.dnb-table__td.dnb-table--x-small,.dnb-table__th.dnb-table--x-small{font-size:.875rem;font-size:var(--font-size-x-small)}.dnb-table.dnb-skeleton>*{-webkit-text-fill-color:#ebebeb;-webkit-text-fill-color:var(--skeleton-color)}.dnb-table .dnb-table__th.dnb-table--sortable,.dnb-table>thead>tr>th.dnb-table--sortable{color:#007272;color:var(--color-sea-green)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-shadow:none;box-shadow:none;color:inherit;font-size:inherit;font-weight:500;font-weight:var(--font-weight-medium);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0 .5rem 0 0;position:relative;text-align:inherit;z-index:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{opacity:0;-webkit-transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out,-webkit-transform .5s ease-out}[data-visual-test-wrapper] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,[data-visual-test-wrapper] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{-webkit-transition:none;transition:none}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text{font-size:inherit;margin:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after{right:1rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon{-ms-flex-item-align:end;align-self:flex-end;margin-bottom:.25rem;margin-top:auto}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after{color:#007272;color:var(--color-sea-green);opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]){color:#007272;color:var(--color-sea-green)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon{opacity:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]){color:#007272;color:var(--color-sea-green)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;height:inherit;left:-.5rem;outline:none;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--sortable[align=right],.dnb-table>thead>tr>th.dnb-table--sortable[align=right]{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text{padding-right:0}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after{right:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{color:#007272;color:var(--color-sea-green);opacity:1}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:visible}html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard]
2
+ .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transform-origin:50% 50%;transform-origin:50% 50%}.dnb-table .dnb-table__th .dnb-table__help-button,.dnb-table>thead>tr>th .dnb-table__help-button{margin-left:.5rem}.dnb-spacing .dnb-table dl,.dnb-spacing .dnb-table ol,.dnb-spacing .dnb-table p,.dnb-spacing .dnb-table pre,.dnb-spacing .dnb-table ul{margin-bottom:0;margin-top:0}