@alfalab/core-components-intl-phone-input 9.1.2 → 9.2.0

package/cssm/components/flag-icon/index.module.css

@@ -1,1566 +1,29 @@
-.flagIcon {
-    display: inline-flex;
-    background-position: center;
-    background-repeat: no-repeat;
-    box-shadow: 0 0 2px 0 rgba(11, 31, 53, 0.25);
-    background-image: url('./images/sprites/flag-icon_size_l@1x.png');
-    background-size: 300px 275px
-}
-
-@media only screen and (min-device-pixel-ratio: 2),
-        only screen and (-webkit-min-device-pixel-ratio: 2),
-        only screen and (min-resolution: 192dpi),
-        only screen and (min-resolution: 2dppx) {
-
-.flagIcon {
-        background-image: url('./images/sprites/flag-icon_size_l@2x.png')
-}
-    }
-
-.ac {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -143px;
-}
-
-.ad {
-    width: 22px;
-    height: 16px;
-    background-position: 0 -34px;
-}
-
-.ae {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -231px;
-}
-
-.af {
-    width: 22px;
-    height: 15px;
-    background-position: -176px 0;
-}
-
-.ag {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -143px;
-}
-
-.ai {
-    width: 22px;
-    height: 11px;
-    background-position: -88px -242px;
-}
-
-.al {
-    width: 22px;
-    height: 16px;
-    background-position: 0 -50px;
-}
-
-.am {
-    width: 22px;
-    height: 11px;
-    background-position: -88px -231px;
-}
-
-.ao {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -15px;
-}
-
-.aq {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -45px;
-}
-
-.ar {
-    width: 22px;
-    height: 14px;
-    background-position: -132px -203px;
-}
-
-.as {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -209px;
-}
-
-.at {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -113px;
-}
-
-.au {
-    width: 22px;
-    height: 11px;
-    background-position: -154px -231px;
-}
-
-.aw {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -90px;
-}
-
-.ax {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -128px;
-}
-
-.az {
-    width: 22px;
-    height: 11px;
-    background-position: -88px -253px;
-}
-
-.ba {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -187px;
-}
-
-.bb {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -143px;
-}
-
-.bd {
-    width: 22px;
-    height: 13px;
-    background-position: -242px -13px;
-}
-
-.be {
-    width: 20px;
-    height: 17px;
-    background-position: -20px -66px;
-}
-
-.bf {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -120px;
-}
-
-.bg {
-    width: 22px;
-    height: 13px;
-    background-position: -242px 0;
-}
-
-.bh {
-    width: 22px;
-    height: 13px;
-    background-position: -198px -218px;
-}
-
-.bi {
-    width: 22px;
-    height: 13px;
-    background-position: -176px -218px;
-}
-
-.bj {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -135px;
-}
-
-.bl {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -188px;
-}
-
-.bm {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -154px;
-}
-
-.bn {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -176px;
-}
-
-.bo {
-    width: 22px;
-    height: 15px;
-    background-position: -62px -66px;
-}
-
-.bq {
-    width: 22px;
-    height: 15px;
-    background-position: -88px 0;
-}
-
-.br {
-    width: 22px;
-    height: 16px;
-    background-position: -66px 0;
-}
-
-.bs {
-    width: 22px;
-    height: 11px;
-    background-position: -198px -231px;
-}
-
-.bt {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -30px;
-}
-
-.bv {
-    width: 22px;
-    height: 16px;
-    background-position: -22px -34px;
-}
-
-.bw {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -60px;
-}
-
-.by {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -66px;
-}
-
-.bz {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -83px;
-}
-
-.ca {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -198px;
-}
-
-.cc {
-    width: 22px;
-    height: 11px;
-    background-position: -22px -264px;
-}
-
-.cd {
-    width: 22px;
-    height: 17px;
-    background-position: -44px -17px;
-}
-
-.cf {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -83px;
-}
-
-.cg {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -83px;
-}
-
-.ch {
-    width: 17px;
-    height: 17px;
-    background-position: -220px -73px;
-}
-
-.ci {
-    width: 22px;
-    height: 15px;
-    background-position: -110px 0;
-}
-
-.ck {
-    width: 22px;
-    height: 11px;
-    background-position: -132px -231px;
-}
-
-.cl {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -15px;
-}
-
-.cm {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -30px;
-}
-
-.cn {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -45px;
-}
-
-.co {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -60px;
-}
-
-.cp {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -75px;
-}
-
-.cr {
-    width: 22px;
-    height: 13px;
-    background-position: -132px -218px;
-}
-
-.cu {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -88px;
-}
-
-.cv {
-    width: 22px;
-    height: 13px;
-    background-position: -88px -218px;
-}
-
-.cw {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -98px;
-}
-
-.cx {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -231px;
-}
-
-.cy {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -98px;
-}
-
-.cz {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -98px;
-}
-
-.de {
-    width: 22px;
-    height: 13px;
-    background-position: -66px -218px;
-}
-
-.dg {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -165px;
-}
-
-.dj {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -113px;
-}
-
-.dk {
-    width: 22px;
-    height: 17px;
-    background-position: -44px 0;
-}
-
-.dm {
-    width: 22px;
-    height: 11px;
-    background-position: -44px -231px;
-}
-
-.do {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -113px;
-}
-
-.dz {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -113px;
-}
-
-.ea {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -113px;
-}
-
-.ec {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -113px;
-}
-
-.ee {
-    width: 22px;
-    height: 14px;
-    background-position: -176px -203px;
-}
-
-.eg {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -15px;
-}
-
-.eh {
-    width: 22px;
-    height: 11px;
-    background-position: -154px -242px;
-}
-
-.er {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -242px;
-}
-
-.es {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -30px;
-}
-
-.et {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -253px;
-}
-
-.eu {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -45px;
-}
-
-.fi {
-    width: 22px;
-    height: 14px;
-    background-position: -198px -203px;
-}
-
-.fj {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -132px;
-}
-
-.fk {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -154px;
-}
-
-.fm {
-    width: 22px;
-    height: 12px;
-    background-position: -242px -62px;
-}
-
-.fo {
-    width: 22px;
-    height: 16px;
-    background-position: -44px -34px;
-}
-
-.fr {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -105px;
-}
-
-.ga {
-    width: 22px;
-    height: 17px;
-    background-position: 0 0;
-}
-
-.gb {
-    width: 22px;
-    height: 11px;
-    background-position: -44px -264px;
-}
-
-.gd {
-    width: 22px;
-    height: 13px;
-    background-position: 0 -218px;
-}
-
-.ge {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -128px;
-}
-
-.gf {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -128px;
-}
-
-.gg {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -128px;
-}
-
-.gh {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -128px;
-}
-
-.gi {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -220px;
-}
-
-.gl {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -128px;
-}
-
-.gm {
-    width: 22px;
-    height: 15px;
-    background-position: -154px 0;
-}
-
-.gn {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -15px;
-}
-
-.gp {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -30px;
-}
-
-.gq {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -45px;
-}
-
-.gr {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -60px;
-}
-
-.gs {
-    width: 22px;
-    height: 11px;
-    background-position: -66px -242px;
-}
-
-.gt {
-    width: 22px;
-    height: 14px;
-    background-position: -220px 0;
-}
-
-.gu {
-    width: 22px;
-    height: 12px;
-    background-position: -242px -26px;
-}
-
-.gw {
-    width: 22px;
-    height: 11px;
-    background-position: -220px -242px;
-}
-
-.gy {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -155px;
-}
-
-.hk {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -120px;
-}
-
-.hm {
-    width: 22px;
-    height: 11px;
-    background-position: -110px -253px;
-}
-
-.hn {
-    width: 22px;
-    height: 11px;
-    background-position: -132px -253px;
-}
-
-.hr {
-    width: 22px;
-    height: 11px;
-    background-position: -220px -253px;
-}
-
-.ht {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -142px;
-}
-
-.hu {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -11px;
-}
-
-.ic {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -143px;
-}
-
-.id {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -143px;
-}
-
-.ie {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -121px;
-}
-
-.il {
-    width: 22px;
-    height: 16px;
-    background-position: -22px -50px;
-}
-
-.im {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -143px;
-}
-
-.in {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -143px;
-}
-
-.io {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -165px;
-}
-
-.iq {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -143px;
-}
-
-.ir {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -116px;
-}
-
-.is {
-    width: 22px;
-    height: 16px;
-    background-position: -44px -50px;
-}
-
-.it {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -158px;
-}
-
-.je {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -103px;
-}
-
-.jm {
-    width: 22px;
-    height: 11px;
-    background-position: -66px -264px;
-}
-
-.jo {
-    width: 22px;
-    height: 11px;
-    background-position: -110px -264px;
-}
-
-.jp {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -158px;
-}
-
-.ke {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -158px;
-}
-
-.kg {
-    width: 22px;
-    height: 13px;
-    background-position: -154px -218px;
-}
-
-.kh {
-    width: 22px;
-    height: 14px;
-    background-position: -220px -42px;
-}
-
-.ki {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -198px;
-}
-
-.km {
-    width: 22px;
-    height: 13px;
-    background-position: -110px -218px;
-}
-
-.kn {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -158px;
-}
-
-.kp {
-    width: 22px;
-    height: 11px;
-    background-position: 0 -231px;
-}
-
-.kr {
-    width: 22px;
-    height: 15px;
-    background-position: -40px -66px;
-}
-
-.kw {
-    width: 22px;
-    height: 11px;
-    background-position: -66px -231px;
-}
-
-.ky {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -110px;
-}
-
-.kz {
-    width: 22px;
-    height: 11px;
-    background-position: -110px -231px;
-}
-
-.la {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -30px;
-}
-
-.lb {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -45px;
-}
-
-.lc {
-    width: 22px;
-    height: 11px;
-    background-position: -176px -231px;
-}
-
-.li {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -129px;
-}
-
-.lk {
-    width: 22px;
-    height: 11px;
-    background-position: -220px -231px;
-}
-
-.lr {
-    width: 22px;
-    height: 12px;
-    background-position: -242px -74px;
-}
-
-.ls {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -90px;
-}
-
-.lt {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -168px;
-}
-
-.lu {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -181px;
-}
-
-.lv {
-    width: 22px;
-    height: 11px;
-    background-position: -176px -242px;
-}
-
-.ly {
-    width: 22px;
-    height: 11px;
-    background-position: -198px -242px;
-}
-
-.ma {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -135px;
-}
-
-.mc {
-    width: 22px;
-    height: 17px;
-    background-position: 0 -17px;
-}
-
-.md {
-    width: 22px;
-    height: 11px;
-    background-position: 0 -253px;
-}
-
-.me {
-    width: 22px;
-    height: 11px;
-    background-position: -22px -253px;
-}
-
-.mf {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -173px;
-}
-
-.mg {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -173px;
-}
-
-.mh {
-    width: 22px;
-    height: 12px;
-    background-position: -242px -38px;
-}
-
-.mk {
-    width: 22px;
-    height: 11px;
-    background-position: -154px -253px;
-}
-
-.ml {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -173px;
-}
-
-.mm {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -173px;
-}
-
-.mn {
-    width: 22px;
-    height: 11px;
-    background-position: -264px 0;
-}
-
-.mo {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -173px;
-}
-
-.mp {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -55px;
-}
-
-.mq {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -173px;
-}
-
-.mr {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -173px;
-}
-
-.ms {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -99px;
-}
-
-.mt {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -173px;
-}
-
-.mu {
-    width: 22px;
-    height: 15px;
-    background-position: -198px 0;
-}
-
-.mv {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -15px;
-}
-
-.mw {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -30px;
-}
-
-.mx {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -90px;
-}
-
-.my {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -176px;
-}
-
-.mz {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -60px;
-}
-
-.na {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -75px;
-}
-
-.nc {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -220px;
-}
-
-.ne {
-    width: 20px;
-    height: 17px;
-    background-position: 0 -66px;
-}
-
-.nf {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -242px;
-}
-
-.ng {
-    width: 22px;
-    height: 11px;
-    background-position: 0 -264px;
-}
-
-.ni {
-    width: 22px;
-    height: 13px;
-    background-position: -44px -218px;
-}
-
-.nl {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -120px;
-}
-
-.no {
-    width: 22px;
-    height: 16px;
-    background-position: -66px -16px;
-}
-
-.np {
-    width: 14px;
-    height: 17px;
-    background-position: -286px 0;
-}
-
-.nr {
-    width: 22px;
-    height: 11px;
-    background-position: -132px -264px;
-}
-
-.nu {
-    width: 22px;
-    height: 11px;
-    background-position: -154px -264px;
-}
-
-.nz {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -121px;
-}
-
-.om {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -132px;
-}
-
-.pa {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -165px;
-}
-
-.pe {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -188px;
-}
-
-.pf {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -188px;
-}
-
-.pg {
-    width: 22px;
-    height: 17px;
-    background-position: -22px 0;
-}
-
-.ph {
-    width: 22px;
-    height: 11px;
-    background-position: -242px -187px;
-}
-
-.pk {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -188px;
-}
-
-.pl {
-    width: 22px;
-    height: 14px;
-    background-position: -154px -203px;
-}
-
-.pm {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -188px;
-}
-
-.pn {
-    width: 22px;
-    height: 11px;
-    background-position: -220px -207px;
-}
-
-.pr {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -188px;
-}
-
-.ps {
-    width: 22px;
-    height: 11px;
-    background-position: -22px -231px;
-}
-
-.pt {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -188px;
-}
-
-.pw {
-    width: 22px;
-    height: 14px;
-    background-position: -110px -203px;
+:root {
+    --color-light-specialbg-tertiary-transparent: rgba(11, 31, 53, 0.1);
 }
+:root {
 
-.py {
-    width: 22px;
-    height: 12px;
-    background-position: -242px -86px;
-}
-
-.qa {
-    width: 22px;
-    height: 9px;
-    background-position: -198px -264px;
-}
-
-.re {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -203px;
-}
-
-.ro {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -203px;
-}
-
-.rs {
-    width: 22px;
-    height: 15px;
-    background-position: -66px -203px;
-}
-
-.ru {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -203px;
-}
-
-.rw {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -188px;
-}
-
-.sa {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -188px;
-}
-
-.sb {
-    width: 22px;
-    height: 11px;
-    background-position: 0 -242px;
-}
-
-.sc {
-    width: 22px;
-    height: 11px;
-    background-position: -22px -242px;
-}
-
-.sd {
-    width: 22px;
-    height: 11px;
-    background-position: -44px -242px;
-}
-
-.se {
-    width: 22px;
-    height: 14px;
-    background-position: -220px -14px;
-}
-
-.sg {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -188px;
-}
-
-.sh {
-    width: 22px;
-    height: 11px;
-    background-position: -110px -242px;
-}
-
-.si {
-    width: 22px;
-    height: 11px;
-    background-position: -132px -242px;
-}
-
-.sj {
-    width: 22px;
-    height: 16px;
-    background-position: -66px -48px;
-}
-
-.sk {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -45px;
-}
-
-.sl {
-    width: 22px;
-    height: 15px;
-    background-position: -44px -173px;
-}
-
-.sm {
-    width: 22px;
-    height: 17px;
-    background-position: -22px -17px;
-}
-
-.sn {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -105px;
-}
-
-.so {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -75px;
-}
-
-.sr {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -60px;
-}
-
-.ss {
-    width: 22px;
-    height: 11px;
-    background-position: -44px -253px;
-}
-
-.st {
-    width: 22px;
-    height: 11px;
-    background-position: -66px -253px;
-}
-
-.sv {
-    width: 22px;
-    height: 13px;
-    background-position: -22px -218px;
-}
-
-.sx {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -158px;
-}
-
-.sy {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -158px;
-}
-
-.sz {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -158px;
-}
-
-.ta {
-    width: 22px;
-    height: 11px;
-    background-position: -176px -253px;
-}
-
-.tc {
-    width: 22px;
-    height: 11px;
-    background-position: -198px -253px;
-}
-
-.td {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -158px;
-}
-
-.tf {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -143px;
-}
+    /* Hard */
 
-.tg {
-    width: 22px;
-    height: 14px;
-    background-position: -220px -28px;
-}
-
-.th {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -143px;
-}
-
-.tj {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -22px;
-}
-
-.tk {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -33px;
-}
-
-.tl {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -44px;
-}
-
-.tm {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -105px;
-}
-
-.tn {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -90px;
-}
-
-.to {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -77px;
-}
-
-.tr {
-    width: 22px;
-    height: 15px;
-    background-position: -154px -75px;
-}
-
-.tt {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -194px;
-}
-
-.tv {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -110px;
-}
-
-.tw {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -128px;
-}
-
-.tz {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -75px;
-}
-
-.ua {
-    width: 22px;
-    height: 15px;
-    background-position: -132px -60px;
-}
-
-.ug {
-    width: 22px;
-    height: 15px;
-    background-position: -132px 0;
-}
-
-.um {
-    width: 22px;
-    height: 12px;
-    background-position: -242px -98px;
-}
-
-.un {
-    width: 22px;
-    height: 15px;
-    background-position: -110px -98px;
-}
-
-.us {
-    width: 22px;
-    height: 12px;
-    background-position: -242px -50px;
-}
-
-.uy {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -98px;
-}
-
-.uz {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -209px;
-}
-
-.va {
-    width: 17px;
-    height: 17px;
-    background-position: -220px -56px;
-}
-
-.vc {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -98px;
-}
-
-.ve {
-    width: 22px;
-    height: 15px;
-    background-position: -88px -83px;
-}
-
-.vg {
-    width: 22px;
-    height: 11px;
-    background-position: -264px -253px;
-}
-
-.vi {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -105px;
-}
+    /* Up */
 
-.vn {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -90px;
+    /* Hard up */
 }
-
-.vu {
-    width: 22px;
-    height: 13px;
-    background-position: -220px -218px;
+:root {
+    --gap-3xs: 2px;
 }
-
-.wf {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -150px;
+:root {
+    --border-radius-xs: 2px;
 }
-
-.ws {
-    width: 22px;
-    height: 11px;
-    background-position: -88px -264px;
+.flagIcon {
+    max-width: 24px;
+    max-height: 24px;
 }
-
-.xk {
-    width: 22px;
+.flagPlaceholder {
+    width: 24px;
     height: 16px;
-    background-position: -66px -32px;
-}
-
-.ye {
-    width: 22px;
-    height: 15px;
-    background-position: -22px -83px;
-}
-
-.yt {
-    width: 22px;
-    height: 15px;
-    background-position: -176px -15px;
-}
-
-.za {
-    width: 22px;
-    height: 15px;
-    background-position: 0 -203px;
-}
-
-.zm {
-    width: 22px;
-    height: 15px;
-    background-position: -198px -150px;
-}
-
-.zw {
-    width: 22px;
-    height: 11px;
-    background-position: -176px -264px;
+    max-height: 16px;
+    border-radius: var(--border-radius-xs);
+    margin-top: var(--gap-3xs);
+    background-color: var(--color-light-specialbg-tertiary-transparent);
 }