intl-tel-input 20.3.0 → 21.0.1

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.
package/README.md CHANGED
@@ -45,11 +45,13 @@ By default, on mobile devices we show a fullscreen popup instead of the inline d
45
45
  * Navigate the country dropdown by typing a country's name, or using up/down keys
46
46
  * Automatically format the number as the user types
47
47
  * Optionally only allow numeric characters and cap the number at the maximum valid length
48
- * The user types their national number and the plugin gives you the full standardized international number
49
- * Full validation, including specific error types
48
+ * The user types their national number and the plugin gives you the full standardised international number
49
+ * Number validation, including specific error types
50
50
  * High-resolution flag images
51
- * Lots of initialisation options for customisation, as well as public methods for interaction
51
+ * Lots of initialisation options for customisation, as well as public methods/events for interaction
52
52
  * Accessibility provided via ARIA tags
53
+ * Typescript declaration files provided
54
+ * Easily customise styles by overriding the provided CSS variables
53
55
 
54
56
 
55
57
  ## Browser Compatibility
@@ -62,16 +64,16 @@ _Note: We have now dropped support for all versions of Internet Explorer because
62
64
  ## Getting Started (Using a CDN)
63
65
  1. Add the CSS
64
66
  ```html
65
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intl-tel-input@20.3.0/build/css/intlTelInput.css">
67
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intl-tel-input@21.0.1/build/css/intlTelInput.css">
66
68
  ```
67
69
 
68
70
  2. Add the plugin script and initialise it on your input element
69
71
  ```html
70
- <script src="https://cdn.jsdelivr.net/npm/intl-tel-input@20.3.0/build/js/intlTelInput.min.js"></script>
72
+ <script src="https://cdn.jsdelivr.net/npm/intl-tel-input@21.0.1/build/js/intlTelInput.min.js"></script>
71
73
  <script>
72
74
  const input = document.querySelector("#phone");
73
75
  window.intlTelInput(input, {
74
- utilsScript: "https://cdn.jsdelivr.net/npm/intl-tel-input@20.3.0/build/js/utils.js",
76
+ utilsScript: "https://cdn.jsdelivr.net/npm/intl-tel-input@21.0.1/build/js/utils.js",
75
77
  });
76
78
  </script>
77
79
  ```
@@ -81,14 +83,13 @@ _Note: We have now dropped support for all versions of Internet Explorer because
81
83
 
82
84
  2. Import the CSS: `import 'intl-tel-input/build/css/intlTelInput.css';`
83
85
 
84
- 3. Override the path to globe.png and flags.png in your CSS
86
+ 3. Set the path to flags.png and globe.png in your CSS, by overriding the CSS variables
85
87
  ```css
86
- .iti__globe { background-image: url("path/to/globe.png"); }
87
- .iti__flag { background-image: url("path/to/flags.png"); }
88
-
89
- @media (min-resolution: 2x) {
90
- .iti__globe { background-image: url("path/to/globe@2x.png"); }
91
- .iti__flag { background-image: url("path/to/flags@2x.png"); }
88
+ .iti {
89
+ --iti-path-flags-1x: url('path/to/flags.png');
90
+ --iti-path-flags-2x: url('path/to/flags@2x.png');
91
+ --iti-path-globe-1x: url('path/to/globe.png');
92
+ --iti-path-globe-2x: url('path/to/globe@2x.png');
92
93
  }
93
94
  ```
94
95
 
@@ -110,14 +111,13 @@ _Note: We have now dropped support for all versions of Internet Explorer because
110
111
  <link rel="stylesheet" href="path/to/intlTelInput.css">
111
112
  ```
112
113
 
113
- 3. Override the path to globe.png and flags.png in your CSS
114
+ 3. Set the path to flags.png and globe.png in your CSS, by overriding the CSS variables
114
115
  ```css
115
- .iti__globe { background-image: url("path/to/globe.png"); }
116
- .iti__flag { background-image: url("path/to/flags.png"); }
117
-
118
- @media (min-resolution: 2x) {
119
- .iti__globe { background-image: url("path/to/globe@2x.png"); }
120
- .iti__flag { background-image: url("path/to/flags@2x.png"); }
116
+ .iti {
117
+ --iti-path-flags-1x: url('path/to/flags.png');
118
+ --iti-path-flags-2x: url('path/to/flags@2x.png');
119
+ --iti-path-globe-1x: url('path/to/globe.png');
120
+ --iti-path-globe-2x: url('path/to/globe@2x.png');
121
121
  }
122
122
  ```
123
123
 
@@ -145,7 +145,7 @@ When you initialise the plugin, the first argument is the input element, and the
145
145
 
146
146
  **allowDropdown**
147
147
  Type: `Boolean` Default: `true`
148
- Whether or not to allow the dropdown. If disabled, there is no dropdown arrow, and the selected flag is not clickable. Also, we display the selected flag on the right instead because it is just a marker of state. Play with this option on [Storybook](https://intl-tel-input.com/storybook/?path=/docs/intltelinput--allowdropdown) (using the React component).
148
+ Whether or not to allow the dropdown. If disabled, there is no dropdown arrow, and the selected country is not clickable. Also, if showFlags is enabled and showSelectedDialCode is disabled, we display the selected flag on the right instead because it is just a marker of state. Play with this option on [Storybook](https://intl-tel-input.com/storybook/?path=/docs/intltelinput--allowdropdown) (using the React component).
149
149
 
150
150
  **autoPlaceholder**
151
151
  Type: `String` Default: `"polite"`
@@ -193,21 +193,21 @@ Format the input value (according to the `nationalMode` option) during initialis
193
193
 
194
194
  **geoIpLookup**
195
195
  Type: `Function` Default: `null`
196
- When setting `initialCountry` to `"auto"`, you must use this option to specify a custom function that calls an IP lookup service to get the user's location and then invokes the callback with the relevant country code. Also note that when instantiating the plugin, a [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) object is returned under the `promise` instance property, so you can do something like `iti.promise.then(callback)` to know when initialisation requests like this have completed.
196
+ When setting `initialCountry` to `"auto"`, you must use this option to specify a custom function that calls an IP lookup service to get the user's location and then invokes the `success` callback with the relevant country code. Also note that when instantiating the plugin, a [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) object is returned under the `promise` instance property, so you can do something like `iti.promise.then(...)` to know when initialisation requests like this have completed.
197
197
 
198
198
  Here is an example using the [ipapi](https://ipapi.co/api/?javascript#location-of-clients-ip) service:
199
199
  ```js
200
200
  intlTelInput(input, {
201
201
  initialCountry: "auto",
202
- geoIpLookup: function(callback) {
202
+ geoIpLookup: function(success, failure) {
203
203
  fetch("https://ipapi.co/json")
204
204
  .then(function(res) { return res.json(); })
205
- .then(function(data) { callback(data.country_code); })
206
- .catch(function() { callback(); });
205
+ .then(function(data) { success(data.country_code); })
206
+ .catch(function() { failure(); });
207
207
  }
208
208
  });
209
209
  ```
210
- _Note that the callback must still be called in the event of an error, hence the use of `catch()` in this example. Tip: store the result in a cookie to avoid repeat lookups!_
210
+ _Note that the `failure` callback must be called in the event of an error, hence the use of `catch()` in this example. Tip: store the result in a cookie to avoid repeat lookups!_
211
211
 
212
212
  **hiddenInput**
213
213
  Type: `Function` Default: `null`
@@ -350,7 +350,7 @@ if (numberType === intlTelInputUtils.numberType.MOBILE) {
350
350
  _Note that in the US there's no way to differentiate between fixed-line and mobile numbers, so instead it will return `FIXED_LINE_OR_MOBILE`._
351
351
 
352
352
  **getSelectedCountryData**
353
- Get the country data for the currently selected flag.
353
+ Get the country data for the currently selected country.
354
354
  ```js
355
355
  const countryData = iti.getSelectedCountryData();
356
356
  ```
@@ -398,7 +398,7 @@ iti.setCountry("gb");
398
398
  ```
399
399
 
400
400
  **setNumber**
401
- Insert a number, and update the selected flag accordingly. _Note that if `formatOnDisplay` is enabled, this will attempt to format the number to either national or international format according to the `nationalMode` option._
401
+ Insert a number, and update the selected country accordingly. _Note that if `formatOnDisplay` is enabled, this will attempt to format the number to either national or international format according to the `nationalMode` option._
402
402
  ```js
403
403
  iti.setNumber("+447733123456");
404
404
  ```
@@ -444,7 +444,7 @@ window.intlTelInputGlobals.loadUtils("build/js/utils.js");
444
444
  You can listen for the following events on the input.
445
445
 
446
446
  **countrychange**
447
- This is triggered when the selected flag is updated e.g. if the user selects a country from the dropdown, or they type a different dial code into the input, or you call `setCountry` etc.
447
+ This is triggered when the selected country is updated e.g. if the user selects a country from the dropdown, or they type a different dial code into the input, or you call `setCountry` etc.
448
448
  ```js
449
449
  input.addEventListener("countrychange", function() {
450
450
  // do something with iti.getSelectedCountryData()
@@ -526,7 +526,6 @@ See the [contributing guide](https://github.com/jackocnr/intl-tel-input/blob/mas
526
526
 
527
527
  ## Links
528
528
  * List of [integrations with intl-tel-input](https://github.com/jackocnr/intl-tel-input/wiki/Integrations)
529
- * Typescript type definitions are available in the [DefinitelyTyped repo](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/intl-tel-input/index.d.ts) (more info [here](https://github.com/jackocnr/intl-tel-input/issues/433#issuecomment-228517623))
530
529
 
531
530
  <img width="200" src="https://www.browserstack.com/images/layout/browserstack-logo-600x315.png" /><br />
532
531
  Testing powered by [BrowserStack Open-Source Program](https://www.browserstack.com/open-source)
@@ -10,7 +10,7 @@ body {
10
10
  }
11
11
 
12
12
  input,
13
- button {
13
+ .button {
14
14
  height: 35px;
15
15
  margin: 0;
16
16
  padding: 6px 12px;
@@ -20,7 +20,7 @@ button {
20
20
  color: inherit;
21
21
  }
22
22
  input[disabled],
23
- button[disabled] {
23
+ .button[disabled] {
24
24
  background-color: #eee;
25
25
  }
26
26
 
@@ -34,13 +34,13 @@ input::placeholder {
34
34
  color: #bbb;
35
35
  }
36
36
 
37
- button {
37
+ .button {
38
38
  color: #fff;
39
39
  background-color: #428bca;
40
40
  border: 1px solid #357ebd;
41
41
  margin-left: 5px;
42
42
  }
43
- button:hover {
43
+ .button:hover {
44
44
  background-color: #3276b1;
45
45
  border-color: #285e8e;
46
46
  cursor: pointer;
@@ -1,3 +1,26 @@
1
+ :root {
2
+ --iti-hover-color: rgba(0, 0, 0, 0.05);
3
+ --iti-text-gray: #999;
4
+ --iti-border-gray: #ccc;
5
+ --iti-spacer-horizontal: 8px;
6
+ --iti-flag-height: 15px;
7
+ --iti-flag-width: 20px;
8
+ --iti-border-width: 1px;
9
+ --iti-arrow-height: 4px;
10
+ --iti-arrow-width: 6px;
11
+ --iti-triangle-border: calc(var(--iti-arrow-width) / 2);
12
+ --iti-arrow-padding: 6px;
13
+ --iti-arrow-color: #555;
14
+ --iti-input-padding: 6px;
15
+ --iti-right-hand-selected-country-padding: calc(var(--iti-spacer-horizontal) + var(--iti-spacer-horizontal) + var(--iti-flag-width));
16
+ --iti-selected-country-arrow-padding: calc(var(--iti-arrow-padding) + var(--iti-arrow-padding) + var(--iti-flag-width) + var(--iti-spacer-horizontal) + var(--iti-arrow-width) + var(--iti-input-padding));
17
+ --iti-path-flags-1x: url("../img/flags.png?1");
18
+ --iti-path-flags-2x: url("../img/flags@2x.png?1");
19
+ --iti-path-globe-1x: url("../img/globe.png");
20
+ --iti-path-globe-2x: url("../img/globe@2x.png");
21
+ --iti-mobile-popup-margin: 30px;
22
+ }
23
+
1
24
  .iti {
2
25
  position: relative;
3
26
  display: inline-block;
@@ -25,39 +48,48 @@
25
48
  z-index: 0;
26
49
  margin-top: 0 !important;
27
50
  margin-bottom: 0 !important;
28
- padding-right: 36px;
51
+ padding-right: var(--iti-right-hand-selected-country-padding);
29
52
  margin-right: 0;
30
53
  }
31
- .iti__flag-container {
54
+ .iti__country-container {
32
55
  position: absolute;
33
56
  top: 0;
34
57
  bottom: 0;
35
58
  right: 0;
36
- padding: 1px;
59
+ padding: var(--iti-border-width);
37
60
  }
38
- .iti__selected-flag {
61
+ .iti__selected-country {
39
62
  z-index: 1;
40
63
  position: relative;
41
64
  display: flex;
42
65
  align-items: center;
43
66
  height: 100%;
44
- padding: 0 6px 0 8px;
67
+ padding: 0 var(--iti-arrow-padding) 0 var(--iti-spacer-horizontal);
68
+ background: none;
69
+ border: 0;
70
+ margin: 0;
71
+ font-size: inherit;
72
+ color: inherit;
73
+ border-radius: 0;
74
+ font-weight: inherit;
75
+ line-height: inherit;
76
+ text-decoration: none;
45
77
  }
46
78
  .iti__arrow {
47
- margin-left: 6px;
79
+ margin-left: var(--iti-arrow-padding);
48
80
  width: 0;
49
81
  height: 0;
50
- border-left: 3px solid transparent;
51
- border-right: 3px solid transparent;
52
- border-top: 4px solid #555;
82
+ border-left: var(--iti-triangle-border) solid transparent;
83
+ border-right: var(--iti-triangle-border) solid transparent;
84
+ border-top: var(--iti-arrow-height) solid var(--iti-arrow-color);
53
85
  }
54
86
  [dir=rtl] .iti__arrow {
55
- margin-right: 6px;
87
+ margin-right: var(--iti-arrow-padding);
56
88
  margin-left: 0;
57
89
  }
58
90
  .iti__arrow--up {
59
91
  border-top: none;
60
- border-bottom: 4px solid #555;
92
+ border-bottom: var(--iti-arrow-height) solid var(--iti-arrow-color);
61
93
  }
62
94
  .iti__dropdown-content {
63
95
  border-radius: 3px;
@@ -67,8 +99,8 @@
67
99
  position: absolute;
68
100
  z-index: 2;
69
101
  margin-top: 3px;
70
- margin-left: -1px;
71
- border: 1px solid #ccc;
102
+ margin-left: calc(var(--iti-border-width) * -1);
103
+ border: var(--iti-border-width) solid var(--iti-border-gray);
72
104
  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
73
105
  }
74
106
  .iti__dropdown-content--dropup {
@@ -82,7 +114,7 @@
82
114
  padding: 9px 12px;
83
115
  }
84
116
  .iti__search-input + .iti__country-list {
85
- border-top: 1px solid #ccc;
117
+ border-top: 1px solid var(--iti-border-gray);
86
118
  }
87
119
  .iti__country-list {
88
120
  list-style: none;
@@ -104,39 +136,39 @@
104
136
  }
105
137
  .iti__flag-box {
106
138
  display: inline-block;
107
- width: 20px;
139
+ width: var(--iti-flag-width);
108
140
  }
109
141
  .iti__divider {
110
142
  padding-bottom: 5px;
111
143
  margin-bottom: 5px;
112
- border-bottom: 1px solid #ccc;
144
+ border-bottom: var(--iti-border-width) solid var(--iti-border-gray);
113
145
  }
114
146
  .iti__country {
115
147
  display: flex;
116
148
  align-items: center;
117
- padding: 8px 8px;
149
+ padding: 8px var(--iti-spacer-horizontal);
118
150
  outline: none;
119
151
  }
120
152
  .iti__dial-code {
121
- color: #999;
153
+ color: var(--iti-text-gray);
122
154
  }
123
155
  .iti__country.iti__highlight {
124
- background-color: rgba(0, 0, 0, 0.05);
156
+ background-color: var(--iti-hover-color);
125
157
  }
126
158
  .iti__flag-box, .iti__country-name {
127
- margin-right: 8px;
159
+ margin-right: var(--iti-spacer-horizontal);
128
160
  }
129
161
  [dir=rtl] .iti__flag-box, [dir=rtl] .iti__country-name {
130
162
  margin-right: 0;
131
- margin-left: 8px;
163
+ margin-left: var(--iti-spacer-horizontal);
132
164
  }
133
165
  .iti--allow-dropdown input.iti__tel-input,
134
166
  .iti--allow-dropdown input.iti__tel-input[type=text],
135
167
  .iti--allow-dropdown input.iti__tel-input[type=tel], .iti--show-selected-dial-code input.iti__tel-input,
136
168
  .iti--show-selected-dial-code input.iti__tel-input[type=text],
137
169
  .iti--show-selected-dial-code input.iti__tel-input[type=tel] {
138
- padding-right: 6px;
139
- padding-left: 52px;
170
+ padding-right: var(--iti-input-padding);
171
+ padding-left: var(--iti-selected-country-arrow-padding);
140
172
  margin-left: 0;
141
173
  }
142
174
  [dir=rtl] .iti--allow-dropdown input.iti__tel-input,
@@ -144,48 +176,48 @@
144
176
  [dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=tel], [dir=rtl] .iti--show-selected-dial-code input.iti__tel-input,
145
177
  [dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=text],
146
178
  [dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=tel] {
147
- padding-right: 52px;
148
- padding-left: 6px;
179
+ padding-right: var(--iti-selected-country-arrow-padding);
180
+ padding-left: var(--iti-input-padding);
149
181
  margin-right: 0;
150
182
  }
151
- .iti--allow-dropdown .iti__flag-container, .iti--show-selected-dial-code .iti__flag-container {
183
+ .iti--allow-dropdown .iti__country-container, .iti--show-selected-dial-code .iti__country-container {
152
184
  right: auto;
153
185
  left: 0;
154
186
  }
155
- [dir=rtl] .iti--allow-dropdown .iti__flag-container, [dir=rtl] .iti--show-selected-dial-code .iti__flag-container {
187
+ [dir=rtl] .iti--allow-dropdown .iti__country-container, [dir=rtl] .iti--show-selected-dial-code .iti__country-container {
156
188
  right: 0;
157
189
  left: auto;
158
190
  }
159
- .iti--allow-dropdown .iti__flag-container:hover {
191
+ .iti--allow-dropdown .iti__country-container:hover, .iti--allow-dropdown .iti__country-container:hover button {
160
192
  cursor: pointer;
161
193
  }
162
- .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
163
- background-color: rgba(0, 0, 0, 0.05);
194
+ .iti--allow-dropdown .iti__country-container:hover .iti__selected-country {
195
+ background-color: var(--iti-hover-color);
164
196
  }
165
- .iti--allow-dropdown .iti__flag-container:has(+ input[disabled]):hover,
166
- .iti--allow-dropdown .iti__flag-container:has(+ input[readonly]):hover {
197
+ .iti--allow-dropdown .iti__country-container:has(+ input[disabled]):hover,
198
+ .iti--allow-dropdown .iti__country-container:has(+ input[readonly]):hover {
167
199
  cursor: default;
168
200
  }
169
- .iti--allow-dropdown .iti__flag-container:has(+ input[disabled]):hover .iti__selected-flag,
170
- .iti--allow-dropdown .iti__flag-container:has(+ input[readonly]):hover .iti__selected-flag {
201
+ .iti--allow-dropdown .iti__country-container:has(+ input[disabled]):hover .iti__selected-country,
202
+ .iti--allow-dropdown .iti__country-container:has(+ input[readonly]):hover .iti__selected-country {
171
203
  background-color: transparent;
172
204
  }
173
- .iti--show-selected-dial-code .iti__selected-flag {
174
- background-color: rgba(0, 0, 0, 0.05);
205
+ .iti--show-selected-dial-code .iti__selected-country {
206
+ background-color: var(--iti-hover-color);
175
207
  }
176
208
  .iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code {
177
- margin-left: 6px;
209
+ margin-left: var(--iti-arrow-padding);
178
210
  }
179
211
  [dir=rtl] .iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code {
180
212
  margin-left: 0;
181
- margin-right: 6px;
213
+ margin-right: var(--iti-arrow-padding);
182
214
  }
183
215
  .iti--container {
184
216
  position: fixed;
185
217
  top: -1000px;
186
218
  left: -1000px;
187
219
  z-index: 1060;
188
- padding: 1px;
220
+ padding: var(--iti-border-width);
189
221
  }
190
222
  .iti--container:hover {
191
223
  cursor: pointer;
@@ -198,7 +230,7 @@
198
230
  left: 0;
199
231
  right: 0;
200
232
  position: fixed;
201
- padding: 30px;
233
+ padding: var(--iti-mobile-popup-margin);
202
234
  display: flex;
203
235
  flex-direction: column;
204
236
  justify-content: center;
@@ -1297,20 +1329,20 @@
1297
1329
  }
1298
1330
 
1299
1331
  .iti__flag {
1300
- height: 15px;
1332
+ height: var(--iti-flag-height);
1301
1333
  box-shadow: 0px 0px 1px 0px #888;
1302
- background-image: url("../img/flags.png?1");
1334
+ background-image: var(--iti-path-flags-1x);
1303
1335
  background-repeat: no-repeat;
1304
- background-position: 20px 0;
1336
+ background-position: var(--iti-flag-width) 0;
1305
1337
  }
1306
1338
  @media (min-resolution: 2x) {
1307
1339
  .iti__flag {
1308
- background-image: url("../img/flags@2x.png?1");
1340
+ background-image: var(--iti-path-flags-2x);
1309
1341
  }
1310
1342
  }
1311
1343
 
1312
1344
  .iti__globe {
1313
- background-image: url("../img/globe.png");
1345
+ background-image: var(--iti-path-globe-1x);
1314
1346
  background-size: contain;
1315
1347
  background-position: right;
1316
1348
  box-shadow: none;
@@ -1318,6 +1350,6 @@
1318
1350
  }
1319
1351
  @media (min-resolution: 2x) {
1320
1352
  .iti__globe {
1321
- background-image: url("../img/globe@2x.png");
1353
+ background-image: var(--iti-path-globe-2x);
1322
1354
  }
1323
1355
  }
@@ -1 +1 @@
1
- .iti{position:relative;display:inline-block}.iti *{box-sizing:border-box}.iti__hide{display:none}.iti__v-hide{visibility:hidden}.iti__a11y-text{width:1px;height:1px;clip:rect(1px,1px,1px,1px);overflow:hidden;position:absolute}.iti input.iti__tel-input,.iti input.iti__tel-input[type=tel],.iti input.iti__tel-input[type=text]{position:relative;z-index:0;margin-top:0!important;margin-bottom:0!important;padding-right:36px;margin-right:0}.iti__flag-container{position:absolute;top:0;bottom:0;right:0;padding:1px}.iti__selected-flag{z-index:1;position:relative;display:flex;align-items:center;height:100%;padding:0 6px 0 8px}.iti__arrow{margin-left:6px;width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:4px solid #555}[dir=rtl] .iti__arrow{margin-right:6px;margin-left:0}.iti__arrow--up{border-top:none;border-bottom:4px solid #555}.iti__dropdown-content{border-radius:3px;background-color:#fff}.iti--inline-dropdown .iti__dropdown-content{position:absolute;z-index:2;margin-top:3px;margin-left:-1px;border:1px solid #ccc;box-shadow:1px 1px 4px rgba(0,0,0,.2)}.iti__dropdown-content--dropup{bottom:100%;margin-bottom:3px}.iti__search-input{width:100%;border-width:0;border-radius:3px;padding:9px 12px}.iti__search-input+.iti__country-list{border-top:1px solid #ccc}.iti__country-list{list-style:none;padding:0;margin:0;overflow-y:scroll;-webkit-overflow-scrolling:touch}.iti--inline-dropdown .iti__country-list{max-height:185px}.iti--flexible-dropdown-width .iti__country-list{white-space:nowrap}@media (max-width:500px){.iti--flexible-dropdown-width .iti__country-list{white-space:normal}}.iti__flag-box{display:inline-block;width:20px}.iti__divider{padding-bottom:5px;margin-bottom:5px;border-bottom:1px solid #ccc}.iti__country{display:flex;align-items:center;padding:8px 8px;outline:0}.iti__dial-code{color:#999}.iti__country.iti__highlight{background-color:rgba(0,0,0,.05)}.iti__country-name,.iti__flag-box{margin-right:8px}[dir=rtl] .iti__country-name,[dir=rtl] .iti__flag-box{margin-right:0;margin-left:8px}.iti--allow-dropdown input.iti__tel-input,.iti--allow-dropdown input.iti__tel-input[type=tel],.iti--allow-dropdown input.iti__tel-input[type=text],.iti--show-selected-dial-code input.iti__tel-input,.iti--show-selected-dial-code input.iti__tel-input[type=tel],.iti--show-selected-dial-code input.iti__tel-input[type=text]{padding-right:6px;padding-left:52px;margin-left:0}[dir=rtl] .iti--allow-dropdown input.iti__tel-input,[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=tel],[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=text],[dir=rtl] .iti--show-selected-dial-code input.iti__tel-input,[dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=tel],[dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=text]{padding-right:52px;padding-left:6px;margin-right:0}.iti--allow-dropdown .iti__flag-container,.iti--show-selected-dial-code .iti__flag-container{right:auto;left:0}[dir=rtl] .iti--allow-dropdown .iti__flag-container,[dir=rtl] .iti--show-selected-dial-code .iti__flag-container{right:0;left:auto}.iti--allow-dropdown .iti__flag-container:hover{cursor:pointer}.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag{background-color:rgba(0,0,0,.05)}.iti--allow-dropdown .iti__flag-container:has(+input[disabled]):hover,.iti--allow-dropdown .iti__flag-container:has(+input[readonly]):hover{cursor:default}.iti--allow-dropdown .iti__flag-container:has(+input[disabled]):hover .iti__selected-flag,.iti--allow-dropdown .iti__flag-container:has(+input[readonly]):hover .iti__selected-flag{background-color:transparent}.iti--show-selected-dial-code .iti__selected-flag{background-color:rgba(0,0,0,.05)}.iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code{margin-left:6px}[dir=rtl] .iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code{margin-left:0;margin-right:6px}.iti--container{position:fixed;top:-1000px;left:-1000px;z-index:1060;padding:1px}.iti--container:hover{cursor:pointer}.iti--fullscreen-popup.iti--container{background-color:rgba(0,0,0,.5);top:0;bottom:0;left:0;right:0;position:fixed;padding:30px;display:flex;flex-direction:column;justify-content:center}.iti--fullscreen-popup.iti--container.iti--country-search{justify-content:flex-start}.iti--fullscreen-popup .iti__dropdown-content{display:flex;flex-direction:column;max-height:100%;position:relative}.iti--fullscreen-popup .iti__country{padding:10px 10px;line-height:1.5em}.iti__flag{width:20px}.iti__flag.iti__be{width:18px}.iti__flag.iti__ch{width:15px}.iti__flag.iti__mc{width:19px}.iti__flag.iti__ne{width:18px}.iti__flag.iti__np{width:13px}.iti__flag.iti__va{width:15px}@media (min-resolution:2x){.iti__flag{background-size:5762px 15px}}.iti__flag.iti__ac{height:10px;background-position:0 0}.iti__flag.iti__ad{height:14px;background-position:-22px 0}.iti__flag.iti__ae{height:10px;background-position:-44px 0}.iti__flag.iti__af{height:14px;background-position:-66px 0}.iti__flag.iti__ag{height:14px;background-position:-88px 0}.iti__flag.iti__ai{height:10px;background-position:-110px 0}.iti__flag.iti__al{height:15px;background-position:-132px 0}.iti__flag.iti__am{height:10px;background-position:-154px 0}.iti__flag.iti__ao{height:14px;background-position:-176px 0}.iti__flag.iti__aq{height:14px;background-position:-198px 0}.iti__flag.iti__ar{height:13px;background-position:-220px 0}.iti__flag.iti__as{height:10px;background-position:-242px 0}.iti__flag.iti__at{height:14px;background-position:-264px 0}.iti__flag.iti__au{height:10px;background-position:-286px 0}.iti__flag.iti__aw{height:14px;background-position:-308px 0}.iti__flag.iti__ax{height:13px;background-position:-330px 0}.iti__flag.iti__az{height:10px;background-position:-352px 0}.iti__flag.iti__ba{height:10px;background-position:-374px 0}.iti__flag.iti__bb{height:14px;background-position:-396px 0}.iti__flag.iti__bd{height:12px;background-position:-418px 0}.iti__flag.iti__be{height:15px;background-position:-440px 0}.iti__flag.iti__bf{height:14px;background-position:-460px 0}.iti__flag.iti__bg{height:12px;background-position:-482px 0}.iti__flag.iti__bh{height:12px;background-position:-504px 0}.iti__flag.iti__bi{height:12px;background-position:-526px 0}.iti__flag.iti__bj{height:14px;background-position:-548px 0}.iti__flag.iti__bl{height:14px;background-position:-570px 0}.iti__flag.iti__bm{height:10px;background-position:-592px 0}.iti__flag.iti__bn{height:10px;background-position:-614px 0}.iti__flag.iti__bo{height:14px;background-position:-636px 0}.iti__flag.iti__bq{height:14px;background-position:-658px 0}.iti__flag.iti__br{height:14px;background-position:-680px 0}.iti__flag.iti__bs{height:10px;background-position:-702px 0}.iti__flag.iti__bt{height:14px;background-position:-724px 0}.iti__flag.iti__bv{height:15px;background-position:-746px 0}.iti__flag.iti__bw{height:14px;background-position:-768px 0}.iti__flag.iti__by{height:10px;background-position:-790px 0}.iti__flag.iti__bz{height:12px;background-position:-812px 0}.iti__flag.iti__ca{height:10px;background-position:-834px 0}.iti__flag.iti__cc{height:10px;background-position:-856px 0}.iti__flag.iti__cd{height:15px;background-position:-878px 0}.iti__flag.iti__cf{height:14px;background-position:-900px 0}.iti__flag.iti__cg{height:14px;background-position:-922px 0}.iti__flag.iti__ch{height:15px;background-position:-944px 0}.iti__flag.iti__ci{height:14px;background-position:-961px 0}.iti__flag.iti__ck{height:10px;background-position:-983px 0}.iti__flag.iti__cl{height:14px;background-position:-1005px 0}.iti__flag.iti__cm{height:14px;background-position:-1027px 0}.iti__flag.iti__cn{height:14px;background-position:-1049px 0}.iti__flag.iti__co{height:14px;background-position:-1071px 0}.iti__flag.iti__cp{height:14px;background-position:-1093px 0}.iti__flag.iti__cq{height:12px;background-position:-1115px 0}.iti__flag.iti__cr{height:12px;background-position:-1137px 0}.iti__flag.iti__cu{height:10px;background-position:-1159px 0}.iti__flag.iti__cv{height:12px;background-position:-1181px 0}.iti__flag.iti__cw{height:14px;background-position:-1203px 0}.iti__flag.iti__cx{height:10px;background-position:-1225px 0}.iti__flag.iti__cy{height:14px;background-position:-1247px 0}.iti__flag.iti__cz{height:14px;background-position:-1269px 0}.iti__flag.iti__de{height:12px;background-position:-1291px 0}.iti__flag.iti__dg{height:10px;background-position:-1313px 0}.iti__flag.iti__dj{height:14px;background-position:-1335px 0}.iti__flag.iti__dk{height:15px;background-position:-1357px 0}.iti__flag.iti__dm{height:10px;background-position:-1379px 0}.iti__flag.iti__do{height:14px;background-position:-1401px 0}.iti__flag.iti__dz{height:14px;background-position:-1423px 0}.iti__flag.iti__ea{height:14px;background-position:-1445px 0}.iti__flag.iti__ec{height:14px;background-position:-1467px 0}.iti__flag.iti__ee{height:13px;background-position:-1489px 0}.iti__flag.iti__eg{height:14px;background-position:-1511px 0}.iti__flag.iti__eh{height:10px;background-position:-1533px 0}.iti__flag.iti__er{height:10px;background-position:-1555px 0}.iti__flag.iti__es{height:14px;background-position:-1577px 0}.iti__flag.iti__et{height:10px;background-position:-1599px 0}.iti__flag.iti__eu{height:14px;background-position:-1621px 0}.iti__flag.iti__ez{height:14px;background-position:-1643px 0}.iti__flag.iti__fi{height:12px;background-position:-1665px 0}.iti__flag.iti__fj{height:10px;background-position:-1687px 0}.iti__flag.iti__fk{height:10px;background-position:-1709px 0}.iti__flag.iti__fm{height:11px;background-position:-1731px 0}.iti__flag.iti__fo{height:15px;background-position:-1753px 0}.iti__flag.iti__fr{height:14px;background-position:-1775px 0}.iti__flag.iti__fx{height:14px;background-position:-1797px 0}.iti__flag.iti__ga{height:15px;background-position:-1819px 0}.iti__flag.iti__gb{height:10px;background-position:-1841px 0}.iti__flag.iti__gd{height:12px;background-position:-1863px 0}.iti__flag.iti__ge{height:14px;background-position:-1885px 0}.iti__flag.iti__gf{height:14px;background-position:-1907px 0}.iti__flag.iti__gg{height:14px;background-position:-1929px 0}.iti__flag.iti__gh{height:14px;background-position:-1951px 0}.iti__flag.iti__gi{height:10px;background-position:-1973px 0}.iti__flag.iti__gl{height:14px;background-position:-1995px 0}.iti__flag.iti__gm{height:14px;background-position:-2017px 0}.iti__flag.iti__gn{height:14px;background-position:-2039px 0}.iti__flag.iti__gp{height:14px;background-position:-2061px 0}.iti__flag.iti__gq{height:14px;background-position:-2083px 0}.iti__flag.iti__gr{height:14px;background-position:-2105px 0}.iti__flag.iti__gs{height:10px;background-position:-2127px 0}.iti__flag.iti__gt{height:13px;background-position:-2149px 0}.iti__flag.iti__gu{height:11px;background-position:-2171px 0}.iti__flag.iti__gw{height:10px;background-position:-2193px 0}.iti__flag.iti__gy{height:12px;background-position:-2215px 0}.iti__flag.iti__hk{height:14px;background-position:-2237px 0}.iti__flag.iti__hm{height:10px;background-position:-2259px 0}.iti__flag.iti__hn{height:10px;background-position:-2281px 0}.iti__flag.iti__hr{height:10px;background-position:-2303px 0}.iti__flag.iti__ht{height:12px;background-position:-2325px 0}.iti__flag.iti__hu{height:10px;background-position:-2347px 0}.iti__flag.iti__ic{height:14px;background-position:-2369px 0}.iti__flag.iti__id{height:14px;background-position:-2391px 0}.iti__flag.iti__ie{height:10px;background-position:-2413px 0}.iti__flag.iti__il{height:15px;background-position:-2435px 0}.iti__flag.iti__im{height:10px;background-position:-2457px 0}.iti__flag.iti__in{height:14px;background-position:-2479px 0}.iti__flag.iti__io{height:10px;background-position:-2501px 0}.iti__flag.iti__iq{height:14px;background-position:-2523px 0}.iti__flag.iti__ir{height:12px;background-position:-2545px 0}.iti__flag.iti__is{height:15px;background-position:-2567px 0}.iti__flag.iti__it{height:14px;background-position:-2589px 0}.iti__flag.iti__je{height:12px;background-position:-2611px 0}.iti__flag.iti__jm{height:10px;background-position:-2633px 0}.iti__flag.iti__jo{height:10px;background-position:-2655px 0}.iti__flag.iti__jp{height:14px;background-position:-2677px 0}.iti__flag.iti__ke{height:14px;background-position:-2699px 0}.iti__flag.iti__kg{height:12px;background-position:-2721px 0}.iti__flag.iti__kh{height:13px;background-position:-2743px 0}.iti__flag.iti__ki{height:10px;background-position:-2765px 0}.iti__flag.iti__km{height:12px;background-position:-2787px 0}.iti__flag.iti__kn{height:14px;background-position:-2809px 0}.iti__flag.iti__kp{height:10px;background-position:-2831px 0}.iti__flag.iti__kr{height:14px;background-position:-2853px 0}.iti__flag.iti__kw{height:10px;background-position:-2875px 0}.iti__flag.iti__ky{height:10px;background-position:-2897px 0}.iti__flag.iti__kz{height:10px;background-position:-2919px 0}.iti__flag.iti__la{height:14px;background-position:-2941px 0}.iti__flag.iti__lb{height:14px;background-position:-2963px 0}.iti__flag.iti__lc{height:10px;background-position:-2985px 0}.iti__flag.iti__li{height:12px;background-position:-3007px 0}.iti__flag.iti__lk{height:10px;background-position:-3029px 0}.iti__flag.iti__lr{height:11px;background-position:-3051px 0}.iti__flag.iti__ls{height:14px;background-position:-3073px 0}.iti__flag.iti__lt{height:12px;background-position:-3095px 0}.iti__flag.iti__lu{height:12px;background-position:-3117px 0}.iti__flag.iti__lv{height:10px;background-position:-3139px 0}.iti__flag.iti__ly{height:10px;background-position:-3161px 0}.iti__flag.iti__ma{height:14px;background-position:-3183px 0}.iti__flag.iti__mc{height:15px;background-position:-3205px 0}.iti__flag.iti__md{height:10px;background-position:-3226px 0}.iti__flag.iti__me{height:10px;background-position:-3248px 0}.iti__flag.iti__mf{height:14px;background-position:-3270px 0}.iti__flag.iti__mg{height:14px;background-position:-3292px 0}.iti__flag.iti__mh{height:11px;background-position:-3314px 0}.iti__flag.iti__mk{height:10px;background-position:-3336px 0}.iti__flag.iti__ml{height:14px;background-position:-3358px 0}.iti__flag.iti__mm{height:14px;background-position:-3380px 0}.iti__flag.iti__mn{height:10px;background-position:-3402px 0}.iti__flag.iti__mo{height:14px;background-position:-3424px 0}.iti__flag.iti__mp{height:10px;background-position:-3446px 0}.iti__flag.iti__mq{height:14px;background-position:-3468px 0}.iti__flag.iti__mr{height:14px;background-position:-3490px 0}.iti__flag.iti__ms{height:10px;background-position:-3512px 0}.iti__flag.iti__mt{height:14px;background-position:-3534px 0}.iti__flag.iti__mu{height:14px;background-position:-3556px 0}.iti__flag.iti__mv{height:14px;background-position:-3578px 0}.iti__flag.iti__mw{height:14px;background-position:-3600px 0}.iti__flag.iti__mx{height:12px;background-position:-3622px 0}.iti__flag.iti__my{height:10px;background-position:-3644px 0}.iti__flag.iti__mz{height:14px;background-position:-3666px 0}.iti__flag.iti__na{height:14px;background-position:-3688px 0}.iti__flag.iti__nc{height:10px;background-position:-3710px 0}.iti__flag.iti__ne{height:15px;background-position:-3732px 0}.iti__flag.iti__nf{height:10px;background-position:-3752px 0}.iti__flag.iti__ng{height:10px;background-position:-3774px 0}.iti__flag.iti__ni{height:12px;background-position:-3796px 0}.iti__flag.iti__nl{height:14px;background-position:-3818px 0}.iti__flag.iti__no{height:15px;background-position:-3840px 0}.iti__flag.iti__np{height:15px;background-position:-3862px 0}.iti__flag.iti__nr{height:10px;background-position:-3877px 0}.iti__flag.iti__nu{height:10px;background-position:-3899px 0}.iti__flag.iti__nz{height:10px;background-position:-3921px 0}.iti__flag.iti__om{height:10px;background-position:-3943px 0}.iti__flag.iti__pa{height:14px;background-position:-3965px 0}.iti__flag.iti__pe{height:14px;background-position:-3987px 0}.iti__flag.iti__pf{height:14px;background-position:-4009px 0}.iti__flag.iti__pg{height:15px;background-position:-4031px 0}.iti__flag.iti__ph{height:10px;background-position:-4053px 0}.iti__flag.iti__pk{height:14px;background-position:-4075px 0}.iti__flag.iti__pl{height:13px;background-position:-4097px 0}.iti__flag.iti__pm{height:14px;background-position:-4119px 0}.iti__flag.iti__pn{height:10px;background-position:-4141px 0}.iti__flag.iti__pr{height:14px;background-position:-4163px 0}.iti__flag.iti__ps{height:10px;background-position:-4185px 0}.iti__flag.iti__pt{height:14px;background-position:-4207px 0}.iti__flag.iti__pw{height:13px;background-position:-4229px 0}.iti__flag.iti__py{height:11px;background-position:-4251px 0}.iti__flag.iti__qa{height:8px;background-position:-4273px 0}.iti__flag.iti__re{height:14px;background-position:-4295px 0}.iti__flag.iti__ro{height:14px;background-position:-4317px 0}.iti__flag.iti__rs{height:14px;background-position:-4339px 0}.iti__flag.iti__ru{height:14px;background-position:-4361px 0}.iti__flag.iti__rw{height:14px;background-position:-4383px 0}.iti__flag.iti__sa{height:14px;background-position:-4405px 0}.iti__flag.iti__sb{height:10px;background-position:-4427px 0}.iti__flag.iti__sc{height:10px;background-position:-4449px 0}.iti__flag.iti__sd{height:10px;background-position:-4471px 0}.iti__flag.iti__se{height:13px;background-position:-4493px 0}.iti__flag.iti__sg{height:14px;background-position:-4515px 0}.iti__flag.iti__sh{height:10px;background-position:-4537px 0}.iti__flag.iti__si{height:10px;background-position:-4559px 0}.iti__flag.iti__sj{height:15px;background-position:-4581px 0}.iti__flag.iti__sk{height:14px;background-position:-4603px 0}.iti__flag.iti__sl{height:14px;background-position:-4625px 0}.iti__flag.iti__sm{height:15px;background-position:-4647px 0}.iti__flag.iti__sn{height:14px;background-position:-4669px 0}.iti__flag.iti__so{height:14px;background-position:-4691px 0}.iti__flag.iti__sr{height:14px;background-position:-4713px 0}.iti__flag.iti__ss{height:10px;background-position:-4735px 0}.iti__flag.iti__st{height:10px;background-position:-4757px 0}.iti__flag.iti__su{height:10px;background-position:-4779px 0}.iti__flag.iti__sv{height:12px;background-position:-4801px 0}.iti__flag.iti__sx{height:14px;background-position:-4823px 0}.iti__flag.iti__sy{height:14px;background-position:-4845px 0}.iti__flag.iti__sz{height:14px;background-position:-4867px 0}.iti__flag.iti__ta{height:10px;background-position:-4889px 0}.iti__flag.iti__tc{height:10px;background-position:-4911px 0}.iti__flag.iti__td{height:14px;background-position:-4933px 0}.iti__flag.iti__tf{height:14px;background-position:-4955px 0}.iti__flag.iti__tg{height:13px;background-position:-4977px 0}.iti__flag.iti__th{height:14px;background-position:-4999px 0}.iti__flag.iti__tj{height:10px;background-position:-5021px 0}.iti__flag.iti__tk{height:10px;background-position:-5043px 0}.iti__flag.iti__tl{height:10px;background-position:-5065px 0}.iti__flag.iti__tm{height:14px;background-position:-5087px 0}.iti__flag.iti__tn{height:14px;background-position:-5109px 0}.iti__flag.iti__to{height:10px;background-position:-5131px 0}.iti__flag.iti__tr{height:14px;background-position:-5153px 0}.iti__flag.iti__tt{height:12px;background-position:-5175px 0}.iti__flag.iti__tv{height:10px;background-position:-5197px 0}.iti__flag.iti__tw{height:14px;background-position:-5219px 0}.iti__flag.iti__tz{height:14px;background-position:-5241px 0}.iti__flag.iti__ua{height:14px;background-position:-5263px 0}.iti__flag.iti__ug{height:14px;background-position:-5285px 0}.iti__flag.iti__uk{height:10px;background-position:-5307px 0}.iti__flag.iti__um{height:11px;background-position:-5329px 0}.iti__flag.iti__un{height:14px;background-position:-5351px 0}.iti__flag.iti__us{height:11px;background-position:-5373px 0}.iti__flag.iti__uy{height:14px;background-position:-5395px 0}.iti__flag.iti__uz{height:10px;background-position:-5417px 0}.iti__flag.iti__va{height:15px;background-position:-5439px 0}.iti__flag.iti__vc{height:14px;background-position:-5456px 0}.iti__flag.iti__ve{height:14px;background-position:-5478px 0}.iti__flag.iti__vg{height:10px;background-position:-5500px 0}.iti__flag.iti__vi{height:14px;background-position:-5522px 0}.iti__flag.iti__vn{height:14px;background-position:-5544px 0}.iti__flag.iti__vu{height:12px;background-position:-5566px 0}.iti__flag.iti__wf{height:14px;background-position:-5588px 0}.iti__flag.iti__ws{height:10px;background-position:-5610px 0}.iti__flag.iti__xk{height:15px;background-position:-5632px 0}.iti__flag.iti__ye{height:14px;background-position:-5654px 0}.iti__flag.iti__yt{height:14px;background-position:-5676px 0}.iti__flag.iti__za{height:14px;background-position:-5698px 0}.iti__flag.iti__zm{height:14px;background-position:-5720px 0}.iti__flag.iti__zw{height:10px;background-position:-5742px 0}.iti__flag{height:15px;box-shadow:0 0 1px 0 #888;background-image:url(../img/flags.png?1);background-repeat:no-repeat;background-position:20px 0}@media (min-resolution:2x){.iti__flag{background-image:url(../img/flags@2x.png?1)}}.iti__globe{background-image:url(../img/globe.png);background-size:contain;background-position:right;box-shadow:none;height:19px}@media (min-resolution:2x){.iti__globe{background-image:url(../img/globe@2x.png)}}
1
+ :root{--iti-hover-color:rgba(0, 0, 0, 0.05);--iti-text-gray:#999;--iti-border-gray:#ccc;--iti-spacer-horizontal:8px;--iti-flag-height:15px;--iti-flag-width:20px;--iti-border-width:1px;--iti-arrow-height:4px;--iti-arrow-width:6px;--iti-triangle-border:calc(var(--iti-arrow-width) / 2);--iti-arrow-padding:6px;--iti-arrow-color:#555;--iti-input-padding:6px;--iti-right-hand-selected-country-padding:calc(var(--iti-spacer-horizontal) + var(--iti-spacer-horizontal) + var(--iti-flag-width));--iti-selected-country-arrow-padding:calc(var(--iti-arrow-padding) + var(--iti-arrow-padding) + var(--iti-flag-width) + var(--iti-spacer-horizontal) + var(--iti-arrow-width) + var(--iti-input-padding));--iti-path-flags-1x:url("../img/flags.png?1");--iti-path-flags-2x:url("../img/flags@2x.png?1");--iti-path-globe-1x:url("../img/globe.png");--iti-path-globe-2x:url("../img/globe@2x.png");--iti-mobile-popup-margin:30px}.iti{position:relative;display:inline-block}.iti *{box-sizing:border-box}.iti__hide{display:none}.iti__v-hide{visibility:hidden}.iti__a11y-text{width:1px;height:1px;clip:rect(1px,1px,1px,1px);overflow:hidden;position:absolute}.iti input.iti__tel-input,.iti input.iti__tel-input[type=tel],.iti input.iti__tel-input[type=text]{position:relative;z-index:0;margin-top:0!important;margin-bottom:0!important;padding-right:var(--iti-right-hand-selected-country-padding);margin-right:0}.iti__country-container{position:absolute;top:0;bottom:0;right:0;padding:var(--iti-border-width)}.iti__selected-country{z-index:1;position:relative;display:flex;align-items:center;height:100%;padding:0 var(--iti-arrow-padding) 0 var(--iti-spacer-horizontal);background:0 0;border:0;margin:0;font-size:inherit;color:inherit;border-radius:0;font-weight:inherit;line-height:inherit;text-decoration:none}.iti__arrow{margin-left:var(--iti-arrow-padding);width:0;height:0;border-left:var(--iti-triangle-border) solid transparent;border-right:var(--iti-triangle-border) solid transparent;border-top:var(--iti-arrow-height) solid var(--iti-arrow-color)}[dir=rtl] .iti__arrow{margin-right:var(--iti-arrow-padding);margin-left:0}.iti__arrow--up{border-top:none;border-bottom:var(--iti-arrow-height) solid var(--iti-arrow-color)}.iti__dropdown-content{border-radius:3px;background-color:#fff}.iti--inline-dropdown .iti__dropdown-content{position:absolute;z-index:2;margin-top:3px;margin-left:calc(var(--iti-border-width) * -1);border:var(--iti-border-width) solid var(--iti-border-gray);box-shadow:1px 1px 4px rgba(0,0,0,.2)}.iti__dropdown-content--dropup{bottom:100%;margin-bottom:3px}.iti__search-input{width:100%;border-width:0;border-radius:3px;padding:9px 12px}.iti__search-input+.iti__country-list{border-top:1px solid var(--iti-border-gray)}.iti__country-list{list-style:none;padding:0;margin:0;overflow-y:scroll;-webkit-overflow-scrolling:touch}.iti--inline-dropdown .iti__country-list{max-height:185px}.iti--flexible-dropdown-width .iti__country-list{white-space:nowrap}@media (max-width:500px){.iti--flexible-dropdown-width .iti__country-list{white-space:normal}}.iti__flag-box{display:inline-block;width:var(--iti-flag-width)}.iti__divider{padding-bottom:5px;margin-bottom:5px;border-bottom:var(--iti-border-width) solid var(--iti-border-gray)}.iti__country{display:flex;align-items:center;padding:8px var(--iti-spacer-horizontal);outline:0}.iti__dial-code{color:var(--iti-text-gray)}.iti__country.iti__highlight{background-color:var(--iti-hover-color)}.iti__country-name,.iti__flag-box{margin-right:var(--iti-spacer-horizontal)}[dir=rtl] .iti__country-name,[dir=rtl] .iti__flag-box{margin-right:0;margin-left:var(--iti-spacer-horizontal)}.iti--allow-dropdown input.iti__tel-input,.iti--allow-dropdown input.iti__tel-input[type=tel],.iti--allow-dropdown input.iti__tel-input[type=text],.iti--show-selected-dial-code input.iti__tel-input,.iti--show-selected-dial-code input.iti__tel-input[type=tel],.iti--show-selected-dial-code input.iti__tel-input[type=text]{padding-right:var(--iti-input-padding);padding-left:var(--iti-selected-country-arrow-padding);margin-left:0}[dir=rtl] .iti--allow-dropdown input.iti__tel-input,[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=tel],[dir=rtl] .iti--allow-dropdown input.iti__tel-input[type=text],[dir=rtl] .iti--show-selected-dial-code input.iti__tel-input,[dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=tel],[dir=rtl] .iti--show-selected-dial-code input.iti__tel-input[type=text]{padding-right:var(--iti-selected-country-arrow-padding);padding-left:var(--iti-input-padding);margin-right:0}.iti--allow-dropdown .iti__country-container,.iti--show-selected-dial-code .iti__country-container{right:auto;left:0}[dir=rtl] .iti--allow-dropdown .iti__country-container,[dir=rtl] .iti--show-selected-dial-code .iti__country-container{right:0;left:auto}.iti--allow-dropdown .iti__country-container:hover,.iti--allow-dropdown .iti__country-container:hover button{cursor:pointer}.iti--allow-dropdown .iti__country-container:hover .iti__selected-country{background-color:var(--iti-hover-color)}.iti--allow-dropdown .iti__country-container:has(+input[disabled]):hover,.iti--allow-dropdown .iti__country-container:has(+input[readonly]):hover{cursor:default}.iti--allow-dropdown .iti__country-container:has(+input[disabled]):hover .iti__selected-country,.iti--allow-dropdown .iti__country-container:has(+input[readonly]):hover .iti__selected-country{background-color:transparent}.iti--show-selected-dial-code .iti__selected-country{background-color:var(--iti-hover-color)}.iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code{margin-left:var(--iti-arrow-padding)}[dir=rtl] .iti--show-selected-dial-code.iti--show-flags .iti__selected-dial-code{margin-left:0;margin-right:var(--iti-arrow-padding)}.iti--container{position:fixed;top:-1000px;left:-1000px;z-index:1060;padding:var(--iti-border-width)}.iti--container:hover{cursor:pointer}.iti--fullscreen-popup.iti--container{background-color:rgba(0,0,0,.5);top:0;bottom:0;left:0;right:0;position:fixed;padding:var(--iti-mobile-popup-margin);display:flex;flex-direction:column;justify-content:center}.iti--fullscreen-popup.iti--container.iti--country-search{justify-content:flex-start}.iti--fullscreen-popup .iti__dropdown-content{display:flex;flex-direction:column;max-height:100%;position:relative}.iti--fullscreen-popup .iti__country{padding:10px 10px;line-height:1.5em}.iti__flag{width:20px}.iti__flag.iti__be{width:18px}.iti__flag.iti__ch{width:15px}.iti__flag.iti__mc{width:19px}.iti__flag.iti__ne{width:18px}.iti__flag.iti__np{width:13px}.iti__flag.iti__va{width:15px}@media (min-resolution:2x){.iti__flag{background-size:5762px 15px}}.iti__flag.iti__ac{height:10px;background-position:0 0}.iti__flag.iti__ad{height:14px;background-position:-22px 0}.iti__flag.iti__ae{height:10px;background-position:-44px 0}.iti__flag.iti__af{height:14px;background-position:-66px 0}.iti__flag.iti__ag{height:14px;background-position:-88px 0}.iti__flag.iti__ai{height:10px;background-position:-110px 0}.iti__flag.iti__al{height:15px;background-position:-132px 0}.iti__flag.iti__am{height:10px;background-position:-154px 0}.iti__flag.iti__ao{height:14px;background-position:-176px 0}.iti__flag.iti__aq{height:14px;background-position:-198px 0}.iti__flag.iti__ar{height:13px;background-position:-220px 0}.iti__flag.iti__as{height:10px;background-position:-242px 0}.iti__flag.iti__at{height:14px;background-position:-264px 0}.iti__flag.iti__au{height:10px;background-position:-286px 0}.iti__flag.iti__aw{height:14px;background-position:-308px 0}.iti__flag.iti__ax{height:13px;background-position:-330px 0}.iti__flag.iti__az{height:10px;background-position:-352px 0}.iti__flag.iti__ba{height:10px;background-position:-374px 0}.iti__flag.iti__bb{height:14px;background-position:-396px 0}.iti__flag.iti__bd{height:12px;background-position:-418px 0}.iti__flag.iti__be{height:15px;background-position:-440px 0}.iti__flag.iti__bf{height:14px;background-position:-460px 0}.iti__flag.iti__bg{height:12px;background-position:-482px 0}.iti__flag.iti__bh{height:12px;background-position:-504px 0}.iti__flag.iti__bi{height:12px;background-position:-526px 0}.iti__flag.iti__bj{height:14px;background-position:-548px 0}.iti__flag.iti__bl{height:14px;background-position:-570px 0}.iti__flag.iti__bm{height:10px;background-position:-592px 0}.iti__flag.iti__bn{height:10px;background-position:-614px 0}.iti__flag.iti__bo{height:14px;background-position:-636px 0}.iti__flag.iti__bq{height:14px;background-position:-658px 0}.iti__flag.iti__br{height:14px;background-position:-680px 0}.iti__flag.iti__bs{height:10px;background-position:-702px 0}.iti__flag.iti__bt{height:14px;background-position:-724px 0}.iti__flag.iti__bv{height:15px;background-position:-746px 0}.iti__flag.iti__bw{height:14px;background-position:-768px 0}.iti__flag.iti__by{height:10px;background-position:-790px 0}.iti__flag.iti__bz{height:12px;background-position:-812px 0}.iti__flag.iti__ca{height:10px;background-position:-834px 0}.iti__flag.iti__cc{height:10px;background-position:-856px 0}.iti__flag.iti__cd{height:15px;background-position:-878px 0}.iti__flag.iti__cf{height:14px;background-position:-900px 0}.iti__flag.iti__cg{height:14px;background-position:-922px 0}.iti__flag.iti__ch{height:15px;background-position:-944px 0}.iti__flag.iti__ci{height:14px;background-position:-961px 0}.iti__flag.iti__ck{height:10px;background-position:-983px 0}.iti__flag.iti__cl{height:14px;background-position:-1005px 0}.iti__flag.iti__cm{height:14px;background-position:-1027px 0}.iti__flag.iti__cn{height:14px;background-position:-1049px 0}.iti__flag.iti__co{height:14px;background-position:-1071px 0}.iti__flag.iti__cp{height:14px;background-position:-1093px 0}.iti__flag.iti__cq{height:12px;background-position:-1115px 0}.iti__flag.iti__cr{height:12px;background-position:-1137px 0}.iti__flag.iti__cu{height:10px;background-position:-1159px 0}.iti__flag.iti__cv{height:12px;background-position:-1181px 0}.iti__flag.iti__cw{height:14px;background-position:-1203px 0}.iti__flag.iti__cx{height:10px;background-position:-1225px 0}.iti__flag.iti__cy{height:14px;background-position:-1247px 0}.iti__flag.iti__cz{height:14px;background-position:-1269px 0}.iti__flag.iti__de{height:12px;background-position:-1291px 0}.iti__flag.iti__dg{height:10px;background-position:-1313px 0}.iti__flag.iti__dj{height:14px;background-position:-1335px 0}.iti__flag.iti__dk{height:15px;background-position:-1357px 0}.iti__flag.iti__dm{height:10px;background-position:-1379px 0}.iti__flag.iti__do{height:14px;background-position:-1401px 0}.iti__flag.iti__dz{height:14px;background-position:-1423px 0}.iti__flag.iti__ea{height:14px;background-position:-1445px 0}.iti__flag.iti__ec{height:14px;background-position:-1467px 0}.iti__flag.iti__ee{height:13px;background-position:-1489px 0}.iti__flag.iti__eg{height:14px;background-position:-1511px 0}.iti__flag.iti__eh{height:10px;background-position:-1533px 0}.iti__flag.iti__er{height:10px;background-position:-1555px 0}.iti__flag.iti__es{height:14px;background-position:-1577px 0}.iti__flag.iti__et{height:10px;background-position:-1599px 0}.iti__flag.iti__eu{height:14px;background-position:-1621px 0}.iti__flag.iti__ez{height:14px;background-position:-1643px 0}.iti__flag.iti__fi{height:12px;background-position:-1665px 0}.iti__flag.iti__fj{height:10px;background-position:-1687px 0}.iti__flag.iti__fk{height:10px;background-position:-1709px 0}.iti__flag.iti__fm{height:11px;background-position:-1731px 0}.iti__flag.iti__fo{height:15px;background-position:-1753px 0}.iti__flag.iti__fr{height:14px;background-position:-1775px 0}.iti__flag.iti__fx{height:14px;background-position:-1797px 0}.iti__flag.iti__ga{height:15px;background-position:-1819px 0}.iti__flag.iti__gb{height:10px;background-position:-1841px 0}.iti__flag.iti__gd{height:12px;background-position:-1863px 0}.iti__flag.iti__ge{height:14px;background-position:-1885px 0}.iti__flag.iti__gf{height:14px;background-position:-1907px 0}.iti__flag.iti__gg{height:14px;background-position:-1929px 0}.iti__flag.iti__gh{height:14px;background-position:-1951px 0}.iti__flag.iti__gi{height:10px;background-position:-1973px 0}.iti__flag.iti__gl{height:14px;background-position:-1995px 0}.iti__flag.iti__gm{height:14px;background-position:-2017px 0}.iti__flag.iti__gn{height:14px;background-position:-2039px 0}.iti__flag.iti__gp{height:14px;background-position:-2061px 0}.iti__flag.iti__gq{height:14px;background-position:-2083px 0}.iti__flag.iti__gr{height:14px;background-position:-2105px 0}.iti__flag.iti__gs{height:10px;background-position:-2127px 0}.iti__flag.iti__gt{height:13px;background-position:-2149px 0}.iti__flag.iti__gu{height:11px;background-position:-2171px 0}.iti__flag.iti__gw{height:10px;background-position:-2193px 0}.iti__flag.iti__gy{height:12px;background-position:-2215px 0}.iti__flag.iti__hk{height:14px;background-position:-2237px 0}.iti__flag.iti__hm{height:10px;background-position:-2259px 0}.iti__flag.iti__hn{height:10px;background-position:-2281px 0}.iti__flag.iti__hr{height:10px;background-position:-2303px 0}.iti__flag.iti__ht{height:12px;background-position:-2325px 0}.iti__flag.iti__hu{height:10px;background-position:-2347px 0}.iti__flag.iti__ic{height:14px;background-position:-2369px 0}.iti__flag.iti__id{height:14px;background-position:-2391px 0}.iti__flag.iti__ie{height:10px;background-position:-2413px 0}.iti__flag.iti__il{height:15px;background-position:-2435px 0}.iti__flag.iti__im{height:10px;background-position:-2457px 0}.iti__flag.iti__in{height:14px;background-position:-2479px 0}.iti__flag.iti__io{height:10px;background-position:-2501px 0}.iti__flag.iti__iq{height:14px;background-position:-2523px 0}.iti__flag.iti__ir{height:12px;background-position:-2545px 0}.iti__flag.iti__is{height:15px;background-position:-2567px 0}.iti__flag.iti__it{height:14px;background-position:-2589px 0}.iti__flag.iti__je{height:12px;background-position:-2611px 0}.iti__flag.iti__jm{height:10px;background-position:-2633px 0}.iti__flag.iti__jo{height:10px;background-position:-2655px 0}.iti__flag.iti__jp{height:14px;background-position:-2677px 0}.iti__flag.iti__ke{height:14px;background-position:-2699px 0}.iti__flag.iti__kg{height:12px;background-position:-2721px 0}.iti__flag.iti__kh{height:13px;background-position:-2743px 0}.iti__flag.iti__ki{height:10px;background-position:-2765px 0}.iti__flag.iti__km{height:12px;background-position:-2787px 0}.iti__flag.iti__kn{height:14px;background-position:-2809px 0}.iti__flag.iti__kp{height:10px;background-position:-2831px 0}.iti__flag.iti__kr{height:14px;background-position:-2853px 0}.iti__flag.iti__kw{height:10px;background-position:-2875px 0}.iti__flag.iti__ky{height:10px;background-position:-2897px 0}.iti__flag.iti__kz{height:10px;background-position:-2919px 0}.iti__flag.iti__la{height:14px;background-position:-2941px 0}.iti__flag.iti__lb{height:14px;background-position:-2963px 0}.iti__flag.iti__lc{height:10px;background-position:-2985px 0}.iti__flag.iti__li{height:12px;background-position:-3007px 0}.iti__flag.iti__lk{height:10px;background-position:-3029px 0}.iti__flag.iti__lr{height:11px;background-position:-3051px 0}.iti__flag.iti__ls{height:14px;background-position:-3073px 0}.iti__flag.iti__lt{height:12px;background-position:-3095px 0}.iti__flag.iti__lu{height:12px;background-position:-3117px 0}.iti__flag.iti__lv{height:10px;background-position:-3139px 0}.iti__flag.iti__ly{height:10px;background-position:-3161px 0}.iti__flag.iti__ma{height:14px;background-position:-3183px 0}.iti__flag.iti__mc{height:15px;background-position:-3205px 0}.iti__flag.iti__md{height:10px;background-position:-3226px 0}.iti__flag.iti__me{height:10px;background-position:-3248px 0}.iti__flag.iti__mf{height:14px;background-position:-3270px 0}.iti__flag.iti__mg{height:14px;background-position:-3292px 0}.iti__flag.iti__mh{height:11px;background-position:-3314px 0}.iti__flag.iti__mk{height:10px;background-position:-3336px 0}.iti__flag.iti__ml{height:14px;background-position:-3358px 0}.iti__flag.iti__mm{height:14px;background-position:-3380px 0}.iti__flag.iti__mn{height:10px;background-position:-3402px 0}.iti__flag.iti__mo{height:14px;background-position:-3424px 0}.iti__flag.iti__mp{height:10px;background-position:-3446px 0}.iti__flag.iti__mq{height:14px;background-position:-3468px 0}.iti__flag.iti__mr{height:14px;background-position:-3490px 0}.iti__flag.iti__ms{height:10px;background-position:-3512px 0}.iti__flag.iti__mt{height:14px;background-position:-3534px 0}.iti__flag.iti__mu{height:14px;background-position:-3556px 0}.iti__flag.iti__mv{height:14px;background-position:-3578px 0}.iti__flag.iti__mw{height:14px;background-position:-3600px 0}.iti__flag.iti__mx{height:12px;background-position:-3622px 0}.iti__flag.iti__my{height:10px;background-position:-3644px 0}.iti__flag.iti__mz{height:14px;background-position:-3666px 0}.iti__flag.iti__na{height:14px;background-position:-3688px 0}.iti__flag.iti__nc{height:10px;background-position:-3710px 0}.iti__flag.iti__ne{height:15px;background-position:-3732px 0}.iti__flag.iti__nf{height:10px;background-position:-3752px 0}.iti__flag.iti__ng{height:10px;background-position:-3774px 0}.iti__flag.iti__ni{height:12px;background-position:-3796px 0}.iti__flag.iti__nl{height:14px;background-position:-3818px 0}.iti__flag.iti__no{height:15px;background-position:-3840px 0}.iti__flag.iti__np{height:15px;background-position:-3862px 0}.iti__flag.iti__nr{height:10px;background-position:-3877px 0}.iti__flag.iti__nu{height:10px;background-position:-3899px 0}.iti__flag.iti__nz{height:10px;background-position:-3921px 0}.iti__flag.iti__om{height:10px;background-position:-3943px 0}.iti__flag.iti__pa{height:14px;background-position:-3965px 0}.iti__flag.iti__pe{height:14px;background-position:-3987px 0}.iti__flag.iti__pf{height:14px;background-position:-4009px 0}.iti__flag.iti__pg{height:15px;background-position:-4031px 0}.iti__flag.iti__ph{height:10px;background-position:-4053px 0}.iti__flag.iti__pk{height:14px;background-position:-4075px 0}.iti__flag.iti__pl{height:13px;background-position:-4097px 0}.iti__flag.iti__pm{height:14px;background-position:-4119px 0}.iti__flag.iti__pn{height:10px;background-position:-4141px 0}.iti__flag.iti__pr{height:14px;background-position:-4163px 0}.iti__flag.iti__ps{height:10px;background-position:-4185px 0}.iti__flag.iti__pt{height:14px;background-position:-4207px 0}.iti__flag.iti__pw{height:13px;background-position:-4229px 0}.iti__flag.iti__py{height:11px;background-position:-4251px 0}.iti__flag.iti__qa{height:8px;background-position:-4273px 0}.iti__flag.iti__re{height:14px;background-position:-4295px 0}.iti__flag.iti__ro{height:14px;background-position:-4317px 0}.iti__flag.iti__rs{height:14px;background-position:-4339px 0}.iti__flag.iti__ru{height:14px;background-position:-4361px 0}.iti__flag.iti__rw{height:14px;background-position:-4383px 0}.iti__flag.iti__sa{height:14px;background-position:-4405px 0}.iti__flag.iti__sb{height:10px;background-position:-4427px 0}.iti__flag.iti__sc{height:10px;background-position:-4449px 0}.iti__flag.iti__sd{height:10px;background-position:-4471px 0}.iti__flag.iti__se{height:13px;background-position:-4493px 0}.iti__flag.iti__sg{height:14px;background-position:-4515px 0}.iti__flag.iti__sh{height:10px;background-position:-4537px 0}.iti__flag.iti__si{height:10px;background-position:-4559px 0}.iti__flag.iti__sj{height:15px;background-position:-4581px 0}.iti__flag.iti__sk{height:14px;background-position:-4603px 0}.iti__flag.iti__sl{height:14px;background-position:-4625px 0}.iti__flag.iti__sm{height:15px;background-position:-4647px 0}.iti__flag.iti__sn{height:14px;background-position:-4669px 0}.iti__flag.iti__so{height:14px;background-position:-4691px 0}.iti__flag.iti__sr{height:14px;background-position:-4713px 0}.iti__flag.iti__ss{height:10px;background-position:-4735px 0}.iti__flag.iti__st{height:10px;background-position:-4757px 0}.iti__flag.iti__su{height:10px;background-position:-4779px 0}.iti__flag.iti__sv{height:12px;background-position:-4801px 0}.iti__flag.iti__sx{height:14px;background-position:-4823px 0}.iti__flag.iti__sy{height:14px;background-position:-4845px 0}.iti__flag.iti__sz{height:14px;background-position:-4867px 0}.iti__flag.iti__ta{height:10px;background-position:-4889px 0}.iti__flag.iti__tc{height:10px;background-position:-4911px 0}.iti__flag.iti__td{height:14px;background-position:-4933px 0}.iti__flag.iti__tf{height:14px;background-position:-4955px 0}.iti__flag.iti__tg{height:13px;background-position:-4977px 0}.iti__flag.iti__th{height:14px;background-position:-4999px 0}.iti__flag.iti__tj{height:10px;background-position:-5021px 0}.iti__flag.iti__tk{height:10px;background-position:-5043px 0}.iti__flag.iti__tl{height:10px;background-position:-5065px 0}.iti__flag.iti__tm{height:14px;background-position:-5087px 0}.iti__flag.iti__tn{height:14px;background-position:-5109px 0}.iti__flag.iti__to{height:10px;background-position:-5131px 0}.iti__flag.iti__tr{height:14px;background-position:-5153px 0}.iti__flag.iti__tt{height:12px;background-position:-5175px 0}.iti__flag.iti__tv{height:10px;background-position:-5197px 0}.iti__flag.iti__tw{height:14px;background-position:-5219px 0}.iti__flag.iti__tz{height:14px;background-position:-5241px 0}.iti__flag.iti__ua{height:14px;background-position:-5263px 0}.iti__flag.iti__ug{height:14px;background-position:-5285px 0}.iti__flag.iti__uk{height:10px;background-position:-5307px 0}.iti__flag.iti__um{height:11px;background-position:-5329px 0}.iti__flag.iti__un{height:14px;background-position:-5351px 0}.iti__flag.iti__us{height:11px;background-position:-5373px 0}.iti__flag.iti__uy{height:14px;background-position:-5395px 0}.iti__flag.iti__uz{height:10px;background-position:-5417px 0}.iti__flag.iti__va{height:15px;background-position:-5439px 0}.iti__flag.iti__vc{height:14px;background-position:-5456px 0}.iti__flag.iti__ve{height:14px;background-position:-5478px 0}.iti__flag.iti__vg{height:10px;background-position:-5500px 0}.iti__flag.iti__vi{height:14px;background-position:-5522px 0}.iti__flag.iti__vn{height:14px;background-position:-5544px 0}.iti__flag.iti__vu{height:12px;background-position:-5566px 0}.iti__flag.iti__wf{height:14px;background-position:-5588px 0}.iti__flag.iti__ws{height:10px;background-position:-5610px 0}.iti__flag.iti__xk{height:15px;background-position:-5632px 0}.iti__flag.iti__ye{height:14px;background-position:-5654px 0}.iti__flag.iti__yt{height:14px;background-position:-5676px 0}.iti__flag.iti__za{height:14px;background-position:-5698px 0}.iti__flag.iti__zm{height:14px;background-position:-5720px 0}.iti__flag.iti__zw{height:10px;background-position:-5742px 0}.iti__flag{height:var(--iti-flag-height);box-shadow:0 0 1px 0 #888;background-image:var(--iti-path-flags-1x);background-repeat:no-repeat;background-position:var(--iti-flag-width) 0}@media (min-resolution:2x){.iti__flag{background-image:var(--iti-path-flags-2x)}}.iti__globe{background-image:var(--iti-path-globe-1x);background-size:contain;background-position:right;box-shadow:none;height:19px}@media (min-resolution:2x){.iti__globe{background-image:var(--iti-path-globe-2x)}}