oldIcon()
  border: none
  fill: transparent
  stroke: #fff
  padding: 0
  *
    fill: inherit
    stroke: inherit
  g
    opacity: 1
  [pid="0"]
    stroke-width: 0

deprecatedIcon()
  border: none
  fill: transparent
  stroke: #fff
  padding: 10px
  *
    fill: inherit
    stroke: inherit
  g
    opacity: 1

.rt-icon
  opacity 1
  position: relative
  visibility visible
  transition-timing-function ease-in-out
  transition-duration .4s
  transition-property opacity,visibility

  &__wrapper
    display: inline-block

  &.wc-icon
    border: none
    border-radius: 50%
    text-align: center
    vertical-align: middle

  &__value
    margin auto
    position absolute
    top 0
    left 0
    right 0
    bottom 0

  .caption.top
    background: inherit
    border: 2px solid #fff
    border-radius: 10px
    color: white
    font-size: 12px;
    line-height: 13px
    min-width: 21px
    height: 21px
    padding: 2px 4px
    position: absolute
    top: -8px
    right: -2px

  .icon-speed__spinned-arrow
    margin: auto
    position: absolute
    width: 100%
    height: 100%
    top: 0
    left: 0
    right: 0
    bottom: 0
    svg
      margin: auto
      position: absolute
      width: 100%
      height: 100%
      top: 0
      left: 0
      right: 0
      bottom: 0
    circle
      stroke-width: 1.4px
      stroke: #ffffff
      transition: stroke-dashoffset 2s ease
    path
      transition: transform 2s ease

  &__
  /* Candy icons from Web-Components */
    &INTERNET_ANTIVIRUS,
    &INTERNET_ANTIVIRUS_K,
    &INTERNET_GAMES,
    &INTERNET_GAMES_FIFA,
    &INTERNET_GAMES_WOT,
    &INTERNET_GAMES_WOW,
    &INTERNET_IP,
    &INTERNET_MAIN,
    &INTERNET_OFICE_365 ,
    &INTERNET_PARENT_CONTROL,
    &INTERNET_ROUTER,
    &INTERNET_SPEED_0,
    &INTERNET_SPEED_20,
    &INTERNET_SPEED_60,
    &INTERNET_SPEED_100,
    &INTERNET_SPEED_200,
    &INTERNET_SPEED_2,
    &INTERNET_SPEED_2,
    &INTERNET_SPEED_3,
    &INTERNET_SPEED_NIGHT,
    &MOBILE_MAIN,
    &MOBILE_CALL,
    &MOBILE_INTERNET,
    &MOBILE_MESSAGE,
    &MOBILE_RTK_APP,
    &MOBILE_SIM,
    &SMART_HOME_CLOUD,
    &SMART_HOME_DOOR_SENSOR,
    &SMART_HOME_FLAME_SENSOR,
    &SMART_HOME_INDOOR_VIDEO,
    &SMART_HOME_LED,
    &SMART_HOME_MAIN,
    &SMART_HOME_OUTDOOR_VIDEO,
    &SMART_HOME_POW_SOCKET,
    &SMART_HOME_MOVE_SENSOR,
    &SMART_HOME_WATER_SENSOR,
    &TELEPHONE_MAIN,
    &TELEPHONE_MOBILE,
    &TELEPHONE_TELEPHONES,
    &TELEPHONE_UNLIM,
    &TV_MAIN,
    &TV_HD,
    &TV_CHANNEL_1,
    &TV_CHANNEL_2,
    &TV_CHANNEL_3,
    &TV_CHANNEL_4,
    &TV_CHANNEL_5,
    &TV_CHANNEL_6,
    &TV_CLOUD,
    &TV_CLOUD_ARH,
    &TV_CONTROL,
    &TV_KARAOKE,
    &TV_MEDIABOX,
    &TV_MULTIROOM,
    &TV_MULTISCREEN,
    &TV_ONLINE,
    &TV_ONLINE_STAR,
    &TV_PULT,
    &OTHER_DEFAULT,
    &OTHER_BONUS_1,
    &OTHER_BONUS_2,
    &OTHER_GIFT_1,
    &OTHER_GIFT_2,
    &OTHER_INSURANCE,
    &YA_DISK
      oldIcon()

    &INTERNET_ANTIVIRUS
      background: #ff5f4b
      [pid="2"]
        stroke-width: 1px

    &INTERNET_ANTIVIRUS_K
      background: #efefef
      [pid="1"]
        fill: #ff3c22
        stroke: transparent
      [pid="2"]
        fill: #1f3238
        stroke: transparent

    &INTERNET_GAMES
      background-image: linear-gradient(135deg,#3023ae,#c86dd7)

    &INTERNET_GAMES_FIFA
      background: rgb(245,245,245)
      [pid="1"],
      [pid="3"]
        fill: #E79A01
        fill: linear-gradient(135deg,#FFD000,#E79A01)
        stroke: transparent
      [pid="2"],
      [pid="4"],
      [pid="5"]
        fill: rgb(29,29,27)
        stroke: transparent

    &INTERNET_GAMES_WOT
      background: #dc4428
      [pid="1"],
      [pid="2"]
        fill: #fff
        stroke: transparent

    &INTERNET_GAMES_WOW
      background: #0058b1
      [pid="2"]
        fill: #fff
        stroke: transparent

    &INTERNET_IP
        background: #50e3c2
        [pid="2"]
          stroke-width: 1px

    &INTERNET_MAIN
      background: #48b2f1
      [pid="2"]
        stroke-width: 1px

    &INTERNET_OFICE_365 
      background: rgba(239,239,239,1)
      [pid="1"]
        fill: rgba(255,63,0,1)
        stroke: transparent

    &INTERNET_PARENT_CONTROL
      background-image: linear-gradient(157deg,#e99fd0,#e6a671)
      [pid="1"],
      [pid="3"]
        stroke-width: 1px
      [pid="4"]
        fill: #fff
        stroke: transparent

    &INTERNET_ROUTER
      background: #c9c2e7
      [pid="2"]
        stroke-width: 1px

    &INTERNET_SPEED_0
      background: #48b2f1
      path
        stroke-width: 1px

    &INTERNET_SPEED_20
      background: #48b2f1
      path
        stroke-width: 1px
      [pid="1"]
        stroke-width: 2px

    &INTERNET_SPEED_60
      background: #48b2f1
      path
        stroke-width: 1px
      [pid="1"]
        stroke-width: 2px

    &INTERNET_SPEED_100
      background: #48b2f1
      path
        stroke-width: 1px
      [pid="1"]
        stroke-width: 2px

    &INTERNET_SPEED_200
      background: #48b2f1
      path
        stroke-width: 1px
      [pid="1"]
        stroke-width: 2px

    &INTERNET_SPEED_2
      background-image: linear-gradient(219deg,#ffbf4d,#ff475e)
      [pid="1"]
        stroke-width: 1px

    &INTERNET_SPEED_2
      background-image: linear-gradient(219deg,#ffbf4d,#ff475e)
      [pid="1"]
        stroke-width: 1px

    &INTERNET_SPEED_3
      background-image: linear-gradient(219deg,#ff8d4d,#ff475e)
      [pid="2"]
        stroke-width: 1px

    &INTERNET_SPEED_NIGHT
      background-image: linear-gradient(135deg,#1900ff,#de3bf9)

    &MOBILE_MAIN
      background-color: #f56ddc
      [pid="2"],
      [pid="3"]
        stroke-width: 1px

    &MOBILE_CALL
      background-image: linear-gradient(135deg,#f56ddc,#ff7640)
      [pid="1"],
      [pid="3"]
        stroke-width: 1px
      [pid="4"]
        fill: #fff
        stroke: transparent

    &MOBILE_INTERNET
      background-image: linear-gradient(to bottom,#74e2d0,#48b2f1)
      [pid="2"],
      [pid="3"],
      [pid="5"],
      [pid="6"]
        stroke-width: 1px

    &MOBILE_MESSAGE
      background-image: linear-gradient(225deg,#7ed9f9,#48b2f1)
      [pid="1"],
      [pid="3"],
      [pid="4"]
        stroke-width: 1px

    &MOBILE_RTK_APP
      background-image: linear-gradient(139deg,#ff9b36,#ef98de)
      [pid="1"],
      [pid="2"]
        stroke-width: 1px

    &MOBILE_SIM
      background: #b8e986
      [pid="1"],
      [pid="2"]
        stroke-width: 1.5

    &SMART_HOME_CLOUD
      background-image: linear-gradient(218deg,#00bffe,#4decff)

    &SMART_HOME_DOOR_SENSOR
      background-image: linear-gradient(to bottom,#e9dac2,#cfb28f)
      [pid="5"]
        stroke-width: 1px

    &SMART_HOME_FLAME_SENSOR
      background-image: linear-gradient(to bottom,#ffe4ad,#ff7e74)

    &SMART_HOME_INDOOR_VIDEO
      background: #00c8f9
      [pid="4"],
      [pid="5"],
      [pid="6"]
        stroke-width: 1px

    &SMART_HOME_LED
      background: #FFD800
      [pid="1"],
      [pid="2"]
        stroke-width: 1.5

    &SMART_HOME_MAIN
      background: #b6de4e

    &SMART_HOME_OUTDOOR_VIDEO
      background: #00c8f9

    &SMART_HOME_POW_SOCKET
      background: #3BBC9E
      [pid="2"],
      [pid="3"]
        stroke-width: 1.5

    &SMART_HOME_MOVE_SENSOR
      background-image: linear-gradient(45deg,#00d8d0,#00d6df)
      [pid="1"]
        stroke: transparent

    &SMART_HOME_WATER_SENSOR
      background-image: linear-gradient(to bottom,#3677eb,#0c8cd1)

    &TELEPHONE_MAIN
      background: #ff7640
      [pid="2"]
        stroke-width: 1px

    &TELEPHONE_MOBILE
      background: #7cbfff
      [pid="2"],
      [pid="3"]
        stroke-width: 1px

    &TELEPHONE_TELEPHONES
      background-image: linear-gradient(138deg,#f56ddc,#ff7640)
      [pid="2"]
        stroke-width: 1px

    &TELEPHONE_UNLIM
      background: #7800ff

    &TV_MAIN
      background: #9a85fc
      [pid="2"]
        fill: #fff
        stroke: none

    &TV_HD
      background: #9a85fc
      [pid="2"]
        fill: #fff
      [pid="3"],
      [pid="4"]
        stroke-width: 1px

    &TV_CHANNEL_1
      background-image: linear-gradient(to bottom,#ffd95f,#e49f4e)

    &TV_CHANNEL_2
      background: #efefef
      [pid="1"]
        fill: #424242
        stroke: transparent

    &TV_CHANNEL_3
      background: #efefef
      [pid="1"],
      [pid="2"],
      [pid="3"]
        fill: #dc4428
        stroke: transparent

    &TV_CHANNEL_4
      background-image: linear-gradient(to bottom,#f5515f,#9f041b)
      [pid="2"]
        fill: #fff
      [pid="3"]
        stroke-width: 1px

    &TV_CHANNEL_5
      background: #50e3c2
      [pid="2"]
        fill: #fff
      [pid="4"]
        stroke-width: 1px

    &TV_CHANNEL_6
      background: #efefef
      [pid="1"]
        fill: #5c79bb
        fill: linear-gradient(to bottom,#5c79bb,#6e84b4)
        stroke: transparent

    &TV_CLOUD
      background-image: linear-gradient(218deg,#00bffe,#4decff)

    &TV_CLOUD_ARH
      background-image: linear-gradient(218deg,#00bffe,#4decff)
      [pid="2"]
        fill: #fff

    &TV_CONTROL
      background-image: linear-gradient(228deg,#85ffcf,#31abde)
      [pid="2"]
        fill: #fff

    &TV_KARAOKE
      background: #ffc232
      [pid="3"]
        stroke-width: 1px

    &TV_MEDIABOX
      background: #c9c2e7

    &TV_MULTIROOM
      background-image: linear-gradient(225deg,#fad961,#fbb0ff)

    &TV_MULTISCREEN
      background-image: linear-gradient(228deg,#d3ff85,#21938a)
      [pid="2"]
        stroke-width: 1px
      [pid="3"],
      [pid="5"]
        fill: #fff
        stroke: transparent

    &TV_ONLINE
      background: #FF4F12
      [pid="0"]
        stroke: transparent
      [pid="1"]
        fill: #fff
        stroke: transparent

    &TV_ONLINE_STAR
      background: #6B68E7
      [pid="1"]
        stroke-width: 1.5
      [pid="2"]
        fill: #fff
        stroke: transparent
      [pid="3"]
        stroke-width: 1

    &TV_PULT
      background: #c9c2e7

    &OTHER_DEFAULT
      background: #a8bae7
      [pid="1"],
      [pid="2"],
      [pid="3"],
      [pid="4"],
      [pid="5"],
      [pid="6"]
        stroke-width: 1px

    &OTHER_BONUS_1
      background-image: linear-gradient(225deg,#d1cdff,#71e7ff 54%,#d8caff)
      [pid="1"],
      [pid="2"],
      [pid="3"]
        stroke-width: 1px

    &OTHER_BONUS_2
      background-image: linear-gradient(225deg,#ffdab1,#ffa99a 51%,#ffd8ac)
      [pid="1"],
      [pid="2"],
      [pid="3"]
        stroke-width: 1px

    &OTHER_GIFT_1
      background: #ff7e74
      [pid="2"],
      [pid="3"]
        stroke-width: 1px

    &OTHER_GIFT_2
      background: #ff7e74

    &OTHER_INSURANCE
      background: #ffc232

    &YA_DISK
      background: #F5F5F5
      [pid="0"]
        fill: none
      [pid="1"]
        stroke-width: 0px
        fill: #0077FF
      [pid="2"]
        stroke-width: 0px
        fill: rgb(13,17,20)
    /* ::Candy icons from Web-Components */

    /* Deprecated icons */
    &icon_

      &24,
      &127,
      &25,
      &26,
      &110,
      &111,
      &403,
      &404,
      &405,
      &406,
      &112,
      &243,
      &244,
      &245,
      &246,
      &131,
      &146,
      &160,
      &239,
      &291,
      &402,
      &403,
      &404,
      &405,
      &406,
      &405,
      &407,
      &408,
      &409,
      &410,
      &411,
      &417,
      &418,
      &419
        deprecatedIcon()

      &24,
      &127
        background: #c9c2e7

      &25
        background: #7800ff

      &26
        background: #ff5f4b

      &110,
      &111,
      &403,
      &404,
      &405,
      &406
        background: #48b2f1

      &112,
      &243,
      &244,
      &245,
      &246
        background-image: linear-gradient(to bottom,#ffd95f,#a46d2c)

      &131
        background-image: linear-gradient(225deg,#fad961,#fbb0ff)

      &146
        background-image: linear-gradient(135deg,#1900ff,#de3bf9)

      &160
        background: #b6de4e

      &239
        background: #50e3c2

      &291
        background-image: linear-gradient(225deg,#d1cdff,#71e7ff 54%,#d8caff)

      &402
        background: #ff7640

      &403
        padding: 2px
        position: relative
        [pid="2"],
        [pid="3"],
        [pid="4"]
          stroke-width: 1px

        [pid="0"],
        [pid="1"],
        [pid="5"]
          stroke-width: 0

      &404,
      &405,
      &406
        padding: 2px
        position: relative
        [pid="3"],
        [pid="4"],
        [pid="5"]
          stroke-width: 1px

        [pid="0"],
        [pid="1"],
        [pid="2"],
        [pid="6"]
          stroke-width: 0

      &405
        padding: 2px
        position: relative
        [pid="3"],
        [pid="4"],
        [pid="5"]
          stroke-width: 1px
        [pid="0"],
        [pid="1"],
        [pid="2"],
        [pid="6"]
          stroke-width: 0

      &407
        background-image: linear-gradient(to bottom,#74e2d0,#48b2f1)
        svg > *,
        [pid="0"],
        [pid="1"],
        [pid="2"]
          stroke-width: 1
        [pid="3"],
        [pid="6"]
          stroke-width: 1.5
        [pid="5"]
          fill: #fff
          stroke: transparent

      &408
        background-image: linear-gradient(225deg,#7ed9f9,#48b2f1)
        svg > *
          stroke-width: 1
        [pid="1"],
        [pid="4"]
          stroke-width: 1.5
        [pid="3"]
          fill: #fff
          stroke: transparent

      &409
        background-image: linear-gradient(135deg,#f56ddc,#ff7640)
        [pid="1"],
        [pid="4"]
          stroke-width: 1.5
        [pid="3"]
          fill: #fff
          stroke: transparent
        &_fixed
          background-image: linear-gradient(to bottom,#6cdf7f,#43c376)
        &_mobile
          background-image: linear-gradient(to bottom,#74e2d0,#48b2f1)

      &410
        background: #9a85fc
        [pid="1"]
          fill: transparent
          stroke: #fff
        [pid="2"]
          fill: #fff
          stroke: transparent

      &411
        background: #9a85fc
        [pid="1"]
          fill: #fff
          stroke: transparent

      &417
        background-image: linear-gradient(228deg,#85ffcf,#31abde)

      &418
        background-image: linear-gradient(to bottom,#FF7E6C,#FF483A)
        [pid="0"]
          stroke-width: 0

      &419
        background-image: linear-gradient(101deg,#28ADD7,#9F8BFF)
        [pid="0"]
          stroke-width: 0
      /* ::Deprecated icons */

  &--not-active
    opacity .3

.themed

  &__047C
    stroke-width 0
    [pid="0"]
      fill #FF4F12
    [pid="1"]
      fill #70f
    [pid="2"]
      fill #273a64
    [pid="3"]
      fill #bc104b

  &__048C
    stroke-width 0
    [pid="0"]
      fill #FF4F12
    [pid="1"]
      fill #70f
    [pid="2"]
      fill #273a64
    [pid="3"],
    [pid="4"],
    [pid="6"]
      fill #FFBE08
    [pid="5"]
      fill #FF4F12

  &__049C
    stroke-width 0
    [pid="0"]
      fill #70f
    [pid="1"]
      fill #BC104B
    [pid="2"]
      fill #FF4F12
    [pid="3"]
      fill #BC104B

.{b2bAppName}-icon
  position absolute
  top 50%
  left 20px
  transform translateY(-50%)

  &+.ripple
    text-indent 36px

  &-image
    .{newAppName}-dark-theme &
      fill #637493