1 |
|
2 | .next-sr-only {
|
3 | position: absolute;
|
4 | width: 1px;
|
5 | height: 1px;
|
6 | padding: 0;
|
7 | overflow: hidden;
|
8 | clip: rect(0, 0, 0, 0);
|
9 | white-space: nowrap;
|
10 | border: 0;
|
11 | top: 0;
|
12 | margin: -1px; }
|
13 |
|
14 | .next-collapse[dir=rtl] .next-collapse-panel-title {
|
15 | padding: 8px 28px 8px 0;
|
16 | padding: var(--collapse-title-padding-tb, 8px) calc(var(--collapse-icon-margin-r, 8px) + var(--collapse-icon-margin-l, 12px) + var(--collapse-icon-size, 8px)) var(--collapse-title-padding-tb, 8px) 0; }
|
17 |
|
18 | .next-collapse[dir=rtl] .next-collapse-panel-icon {
|
19 | left: inherit;
|
20 | right: 12px;
|
21 | right: var(--collapse-icon-margin-l, 12px);
|
22 | transform: rotate(180deg);
|
23 | margin-left: 0px;
|
24 | margin-right: 0px; }
|
25 | .next-collapse[dir=rtl] .next-collapse-panel-icon:before,
|
26 | .next-collapse[dir=rtl] .next-collapse-panel-icon .next-icon-remote {
|
27 | width: 8px;
|
28 | width: var(--collapse-icon-size, 8px);
|
29 | font-size: 8px;
|
30 | font-size: var(--collapse-icon-size, 8px);
|
31 | line-height: inherit; }
|
32 | @media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
|
33 | .next-collapse[dir=rtl] .next-collapse-panel-icon {
|
34 | transform: scale(0.5) rotate(180deg);
|
35 | margin-left: -4px;
|
36 | margin-left: calc(0px - var(--icon-s, 16px)/2 + var(--collapse-icon-size, 8px)/2);
|
37 | margin-right: -4px;
|
38 | margin-right: calc(0px - var(--icon-s, 16px)/2 + var(--collapse-icon-size, 8px)/2); }
|
39 | .next-collapse[dir=rtl] .next-collapse-panel-icon:before {
|
40 | width: 16px;
|
41 | width: var(--icon-s, 16px);
|
42 | font-size: 16px;
|
43 | font-size: var(--icon-s, 16px); } }
|
44 |
|
45 |
|
46 | .next-collapse {
|
47 | box-sizing: border-box;
|
48 | border: 1px solid #DCDEE3;
|
49 | border: var(--collapse-border-width, 1px) solid var(--collapse-border-color, #DCDEE3);
|
50 | border-radius: 3px;
|
51 | border-radius: var(--collapse-border-corner, 3px); }
|
52 | .next-collapse *,
|
53 | .next-collapse *:before,
|
54 | .next-collapse *:after {
|
55 | box-sizing: border-box; }
|
56 | .next-collapse:focus,
|
57 | .next-collapse *:focus {
|
58 | outline: 0; }
|
59 | .next-collapse-panel:not(:first-child) {
|
60 | border-top: 1px solid #DCDEE3;
|
61 | border-top: var(--collapse-title-border-width, 1px) solid var(--collapse-panel-border-color, #DCDEE3); }
|
62 | .next-collapse .next-collapse-panel-icon {
|
63 | position: absolute;
|
64 | color: #333333;
|
65 | color: var(--collapse-icon-color, #333333);
|
66 | transition: transform 100ms linear;
|
67 | transition: transform var(--motion-duration-immediately, 100ms) var(--motion-linear, linear);
|
68 | left: 12px;
|
69 | left: var(--collapse-icon-margin-l, 12px);
|
70 | margin-top: -2px;
|
71 | margin-left: 0px;
|
72 | margin-right: 0px; }
|
73 | .next-collapse .next-collapse-panel-icon:before,
|
74 | .next-collapse .next-collapse-panel-icon .next-icon-remote {
|
75 | width: 8px;
|
76 | width: var(--collapse-icon-size, 8px);
|
77 | font-size: 8px;
|
78 | font-size: var(--collapse-icon-size, 8px);
|
79 | line-height: inherit; }
|
80 | @media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
|
81 | .next-collapse .next-collapse-panel-icon {
|
82 | transform: scale(0.5);
|
83 | margin-left: -4px;
|
84 | margin-left: calc(0px - var(--icon-s, 16px)/2 + var(--collapse-icon-size, 8px)/2);
|
85 | margin-right: -4px;
|
86 | margin-right: calc(0px - var(--icon-s, 16px)/2 + var(--collapse-icon-size, 8px)/2); }
|
87 | .next-collapse .next-collapse-panel-icon:before {
|
88 | width: 16px;
|
89 | width: var(--icon-s, 16px);
|
90 | font-size: 16px;
|
91 | font-size: var(--icon-s, 16px); } }
|
92 | .next-collapse-panel-title {
|
93 | position: relative;
|
94 | line-height: 1.5;
|
95 | line-height: var(--font-lineheight-2, 1.5);
|
96 | background: #F2F3F7;
|
97 | background: var(--collapse-title-bg-color, #F2F3F7);
|
98 | font-size: 14px;
|
99 | font-size: var(--collapse-title-font-size, 14px);
|
100 | font-weight: normal;
|
101 | font-weight: var(--collapse-title-font-weight, normal);
|
102 | color: #333333;
|
103 | color: var(--collapse-title-font-color, #333333);
|
104 | cursor: pointer;
|
105 | padding: 8px 0 8px 28px;
|
106 | padding: var(--collapse-title-padding-tb, 8px) 0 var(--collapse-title-padding-tb, 8px) calc(var(--collapse-icon-margin-r, 8px) + var(--collapse-icon-margin-l, 12px) + var(--collapse-icon-size, 8px));
|
107 | transition: background 100ms linear;
|
108 | transition: background var(--motion-duration-immediately, 100ms) var(--motion-linear, linear); }
|
109 | .next-collapse-panel-title:hover {
|
110 | background: #EBECF0;
|
111 | background: var(--collapse-title-hover-bg-color, #EBECF0);
|
112 | color: #333333;
|
113 | color: var(--collapse-title-hover-font-color, #333333);
|
114 | font-weight: normal;
|
115 | font-weight: var(--collapse-title-hover-font-weight, normal); }
|
116 | .next-collapse-panel-title:hover .next-collapse-panel-icon {
|
117 | color: #333333;
|
118 | color: var(--collapse-icon-hover-color, #333333); }
|
119 | .next-collapse-panel-content {
|
120 | height: 0;
|
121 | line-height: 1.5;
|
122 | line-height: var(--font-lineheight-2, 1.5);
|
123 | padding: 0 16px;
|
124 | padding: 0 var(--collapse-content-padding-x, 16px);
|
125 | background: #FFFFFF;
|
126 | background: var(--collapse-content-bg-color, #FFFFFF);
|
127 | font-size: 12px;
|
128 | font-size: var(--collapse-content-font-size, 12px);
|
129 | color: #666666;
|
130 | color: var(--collapse-content-color, #666666);
|
131 | transition: all 300ms ease;
|
132 | transition: all var(--motion-duration-standard, 300ms) var(--motion-ease, ease);
|
133 | opacity: 0; }
|
134 | .next-collapse-panel-expanded > .next-collapse-panel-content {
|
135 | display: block;
|
136 | padding: 12px 16px;
|
137 | padding: var(--collapse-content-padding-y, 12px) var(--collapse-content-padding-x, 16px);
|
138 | height: auto;
|
139 | opacity: 1; }
|
140 | .next-collapse .next-collapse-unfold-icon::before {
|
141 | content: "";
|
142 | content: var(--collapse-unfold-icon-content, ""); }
|
143 | .next-collapse-panel-hidden > .next-collapse-panel-content {
|
144 | overflow: hidden; }
|
145 | .next-collapse .next-collapse-panel-icon::before {
|
146 | content: "";
|
147 | content: var(--collapse-fold-icon-content, ""); }
|
148 | .next-collapse .next-collapse-panel-icon.next-collapse-panel-icon-expanded {
|
149 | transform: rotate(90deg);
|
150 | margin-left: 0px;
|
151 | margin-right: 0px; }
|
152 | .next-collapse .next-collapse-panel-icon.next-collapse-panel-icon-expanded:before,
|
153 | .next-collapse .next-collapse-panel-icon.next-collapse-panel-icon-expanded .next-icon-remote {
|
154 | width: 8px;
|
155 | width: var(--collapse-icon-size, 8px);
|
156 | font-size: 8px;
|
157 | font-size: var(--collapse-icon-size, 8px);
|
158 | line-height: inherit; }
|
159 | @media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
|
160 | .next-collapse .next-collapse-panel-icon.next-collapse-panel-icon-expanded {
|
161 | transform: scale(0.5) rotate(90deg);
|
162 | margin-left: -4px;
|
163 | margin-left: calc(0px - var(--icon-s, 16px)/2 + var(--collapse-icon-size, 8px)/2);
|
164 | margin-right: -4px;
|
165 | margin-right: calc(0px - var(--icon-s, 16px)/2 + var(--collapse-icon-size, 8px)/2); }
|
166 | .next-collapse .next-collapse-panel-icon.next-collapse-panel-icon-expanded:before {
|
167 | width: 16px;
|
168 | width: var(--icon-s, 16px);
|
169 | font-size: 16px;
|
170 | font-size: var(--icon-s, 16px); } }
|
171 | .next-collapse-disabled {
|
172 | border-color: #E6E7EB;
|
173 | border-color: var(--collapse-disabled-border-color, #E6E7EB); }
|
174 | .next-collapse-panel-disabled:not(:first-child) {
|
175 | border-color: #E6E7EB;
|
176 | border-color: var(--collapse-disabled-border-color, #E6E7EB); }
|
177 | .next-collapse-panel-disabled > .next-collapse-panel-title {
|
178 | cursor: not-allowed;
|
179 | color: #CCCCCC;
|
180 | color: var(--collapse-title-font-disabled-color, #CCCCCC);
|
181 | background: #F2F3F7;
|
182 | background: var(--collapse-title-disabled-bg-color, #F2F3F7); }
|
183 | .next-collapse-panel-disabled .next-collapse-panel-icon {
|
184 | color: #CCCCCC;
|
185 | color: var(--collapse-title-font-disabled-color, #CCCCCC); }
|
186 | .next-collapse-panel-disabled .next-collapse-panel-title:hover {
|
187 | font-weight: normal;
|
188 | font-weight: var(--collapse-title-font-weight, normal); }
|
189 | .next-collapse-panel-disabled .next-collapse-panel-title:hover .next-collapse-panel-icon {
|
190 | color: #CCCCCC;
|
191 | color: var(--collapse-title-font-disabled-color, #CCCCCC); }
|
192 | .next-collapse-panel-disabled:hover {
|
193 | color: #CCCCCC;
|
194 | color: var(--collapse-title-font-disabled-color, #CCCCCC);
|
195 | background: #F2F3F7;
|
196 | background: var(--collapse-title-disabled-bg-color, #F2F3F7); }
|