@font-face {
  font-family: 'SF Pro';
  font-style: normal;
  font-weight: 600;
  src: url(../font/sf-pro-text_semibold.a0c74f8f.woff2) format("woff2")
}

@font-face {
  font-family: 'SF Pro';
  font-style: normal;
  font-weight: 500;
  src: url(../font/sf-pro-text_medium.dcc28d6a.woff2) format("woff2")
}

@font-face {
  font-family: 'SF Pro';
  font-style: normal;
  font-weight: 400;
  src: url(../font/sf-pro-text_regular.07bdfc6e.woff2) format("woff2")
}

@font-face {
  font-family: WeChatNum;
  font-style: normal;
  font-weight: 400;
  src: url(../font/WeChatNum.04b083e1.ttf)
}

/* 苹方-简 细体 */
/* @font-face {
  font-family: 'PingFang SC';
  font-style: normal;
  font-weight: 300;
  src: url('./PingFangSC-Light.woff2') format('woff2');
} */

/* 苹方-简 常规体 */
/* @font-face {
  font-family: 'PingFang SC';
  font-style: normal;
  font-weight: 400;
  src: url('./PingFangSC-Regular.woff2') format('woff2');
} */

/* 苹方-简 中黑体 */
/* @font-face {
  font-family: 'PingFang SC';
  font-style: normal;
  font-weight: 500;
  src: url('./PingFangSC-Medium.woff2') format('woff2');
} */

/* 苹方-简 中粗体 */
/* @font-face {
  font-weight: 600;
  font-style: normal;
  font-family: 'PingFang SC';
  src: url('./PingFangSC-Semibold.woff2') format('woff2');
} */

body {
  font-family: SF Pro, "Helvetica Neue", "PingFang SC", -apple-system, sans-serif, Roboto;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}

.hide {
  display: none;
}

#screen {
  user-select: none;
}

.logout,
.no-username {
  cursor: pointer;
}

.goods-item-selecetd {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);

}

.mask1 {
  color: transparent !important;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.mask2,
.mask3,
.mask4,
.mask5,
.mask6,
.mask7,
.mask8,
.mask9,
.mask10,
.mask11,
.mask12,
.mask13,
.mask14,
.mask15 {
  position: relative;
}

.mask2:before,
.mask3:before,
.mask4:before,
.mask5:before,
.mask6:before,
.mask7:before,
.mask8:before,
.mask9:before,
.mask10:before,
.mask11:before,
.mask12:before,
.mask13:before,
.mask14:before,
.mask15:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.mask2:before {
  background-color: #000;
}

.mask3:before {
  background-color: red;
}

.mask4:before {
  background-color: green;
}

.mask5:before {
  background-color: blue;
}

.mask6:before {
  background-color: gray;
}

.mask7:before {
  background-color: purple;
}

/* 示例：经典灰色马赛克 */
.mask8:before {
  background: linear-gradient(45deg, #ccc 25%, transparent 25%),
    linear-gradient(-45deg, #ccc 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #ccc 75%),
    linear-gradient(-45deg, transparent 75%, #ccc 75%);
  background-size: 10px 10px;
}

/* 彩色马赛克 */
.mask9:before {
  background: linear-gradient(45deg, #ff6b6b 25%, transparent 25%),
    linear-gradient(-45deg, #6bc1ff 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #6bffb3 75%),
    linear-gradient(-45deg, transparent 75%, #ffdb6b 75%);
  background-size: 10px 10px;
}

/* 暗黑风格马赛克 */
.mask10:before {
  background: linear-gradient(45deg, #333 25%, #444 25%),
    linear-gradient(-45deg, #333 25%, #444 25%);
  background-size: 10px 10px;
}

/* 极简白色马赛克 */
.mask11:before {
  background: linear-gradient(45deg, #fff 25%, transparent 25%),
    linear-gradient(-45deg, #fff 25%, transparent 25%);
  background-size: 15px 15px;
}

/* 数码风格马赛克 */
.mask12:before {
  background: linear-gradient(90deg, #333 25%, transparent 25%),
    linear-gradient(90deg, transparent 75%, #333 75%);
  background-size: 8px 8px;
}

/* 复古绿色马赛克 */
.mask13:before {
  background: linear-gradient(45deg, #4caf50 25%, transparent 25%),
    linear-gradient(-45deg, #4caf50 25%, transparent 25%);
  background-size: 12px 12px;
}

/* 霓虹马赛克 */
.mask14:before {
  background: linear-gradient(45deg, #ff0080 25%, transparent 25%),
    linear-gradient(-45deg, #00f0ff 25%, transparent 25%);
  background-size: 15px 15px;
  mix-blend-mode: screen;
}

/* 彩虹马赛克 */
.mask15:before {
  background: repeating-linear-gradient(45deg,
      #ff0000 0,
      #ff0000 10px,
      #ff7f00 10px,
      #ff7f00 20px,
      #ffff00 20px,
      #ffff00 30px,
      #00ff00 30px,
      #00ff00 40px,
      #0000ff 40px,
      #0000ff 50px,
      #4b0082 50px,
      #4b0082 60px,
      #9400d3 60px,
      #9400d3 70px);
  background-size: 20px 20px;
}

/*# topbar */
#screen .ios-bar.ios-bar-v1 {
  /* opacity: 0.5; */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  /* height: 123px; */
  height: 74.5px;
  background-color: #ffffff;
  padding: 0 42px 0 47.5px;
  display: flex;
  align-items: center;
}

#screen .ios-bar.ios-bar-v1>.ios-left {
  flex: 1 1;
  display: flex;
  align-items: center;
}

#screen .ios-bar.ios-bar-v1>.ios-left .ios-time {
  font-size: 20px;
  font-weight: 600;
  margin: 7.5px;
}

#screen .ios-bar.ios-bar-v1>.ios-left .ios-location {
  width: 18px;
  height: 18px;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAMAAAC7IEhfAAABHVBMVEUAAACjo6O+vr7Gxsaenp7U1NTV1dUjIyMxMjFAQEBLS0tfX19nZ2eUlJS3t7e9vb3Dw8PBwcGurq7BwcHo6OgjIyMsLCw4ODg2NzZKSkpUVFRra2t1dXVzc3NycnJ+fn6Li4uZmZmqqqqZmZmnp6fW1tbQ0NDR1dG8vLy4uLiysrLb29tubm4dHR0zMzNlZWUrKyusrKxGRkaqqqpISEinp6dQUFBbW1umpqakpKSXl5dOTk6ioqJtbW1oaGigoKB9fX2Hh4eMjIyenp6goKCurq6Li4utra24uLitra2rq6vn5+eoqKjBwcGenp7j4+P///8AAAAFBQUODg4bGxsSEhIWFhYJCQkICAiqqqqjo6N8fHxgYGBCQkI8PDzdyyUpAAAAUXRSTlMAGAssVhoM9urf187JXzo1MyMbDw787+vm2dTGxMK8sqtRTUtDOyUhFxIQB/779PPw6eXg3NfW0M7NzczKvbqzs7Cfg3NlZVpTQUA1MjEqEgVc1275AAABdklEQVQ4y62T13LCMBBFNyH0XhIIJfSa3nvvPcIG0v//MzK7IwkHFMsPOQ+W9nLGI3EB/o3nQp+xNY9OawS7DFmy16KzTGD3ypqPDYn/qYWnmRVQM1/sCaNr4DOg1Ny5gdCMhXof16hCc2WZwDwF2MONb1yL+KU2M4UBHbU2qk2tSM0fAeQS994RrWTKG2w3eJbGMWy1UnlD3qCQEmkM555Fa1JVhHlmybcwKcoxNqzKVwELbowGL3yqpKW24YJfhDAM8eFI3uBzrKBXjN1A3Ajv+y0Zj7fanU470eLiCeZZPuSYgkUgqHBxmjmm4oF+QPTFy2qVIrXnxV0EBOWBQjwHgFsqHCwkEhOCp/IFneUYADLy1Wqi+PkBb88ENbKNXYAAriUbMYnCDtRxMcAGDxqbsIxL3k6cRGP9ntpLacXVD3wGQSu+U3tNvfjF/8wakfPoUMyAQ/HOoegFDUkuVnWihxF90GKQeKUXq+jtgwNch6HrsfAHPYGevLbwJmoAAAAASUVORK5CYII=);
  background-size: cover;
  text-indent: -9999px;
  display: block;
  margin-right: 7.5px;
  position: relative;
  left: -3px;
}

#screen .ios-bar.ios-bar-v1>.ios-right {
  display: flex;
  align-items: center;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_single {
  margin-left: 7.5px;
  width: 25px;
  height: 16px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAAkBAMAAAAwddR+AAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABHRSTlMA5ogGBMV9/gAAAGJJREFUKM9joC4wEnERMsAhp+Li4qKAQ04EKCeAQ84FCBxoLIdwPEIO0/EIOUzHY5WDCtJWDtPxUAqr46EUhuMx5aA86shhOhBBYToQQaE6cKhSYD9gpaB+x0pBwww7RSYAALyWaRE+YyM2AAAAAElFTkSuQmCC);
  background-size: cover;
  text-indent: -9999px;
  position: relative;
}

#screen .ios-bar.ios-bar-v1 .ios-single-1,
#screen .ios-bar.ios-bar-v1 .ios-single-2 {
  /* display: none; */
  position: absolute;
  background-color: #9b9b9b;
  border-radius: 1.2px;
  width: 4px;
}

#screen .ios-bar.ios-bar-v1 .ios-single-1 {
  height: 15px;
  right: 0.6px;
  top: 1px;
}

#screen .ios-bar.ios-bar-v1 .ios-single-2 {
  height: 12px;
  right: 7.1px;
  top: 4px;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_wifi {
  margin-left: 5.5px;
  width: 29.5px;
  height: 20.5px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD8AAAAtCAMAAAAun0N9AAAAe1BMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC9eBywAAAAKHRSTlMA8+16C9WpF+rdrWn85eNwXygiDTIuE9nMw6Shm4BZHMWPhnRWR0EFYlXd4QAAAVBJREFUSMftkkmWgyAURVEQG9TYJEYTm/Rh/yusYymIglI6qJF3+rkPPueBHSVN/cB5aPq+Geb4UTdr3O+7DOmEsHx//2Ynd5MqMe+J3j55Pp3F907Ltl1yW41f2gt6ZFAtRjRnZ5501i0KV8r0MqUeu1TAudYJ6gYoqa+OOHNjhf4xBbk6TsfHSogwP7IfDlOIgAIEhxtCeQzZzjAFM6SQ/QUEMtXvxIr5i6F3cw3DvXmQbxNbtKWSZPaCC+rlqzP+zb446MJvl3kGhJWQSrDqkeAJ5uB3yLC3aWA7SrC/0fIyFrr70vvB2BinBXqf8BrhKEFteyPMi0OAnkNnizVK++oddC4PwOmkenjQ9QEBUewVMP2/QBFu+48jtEknDm8/2aBjKoDX+7no5+v95jzo5wasxz5z3QZbsK1Ot5i+IYDp2wOsDGwnK4oM7OzM8gOvPFaPDc4nDQAAAABJRU5ErkJggg==);
  background-size: cover;
  text-indent: -9999px;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_battery {
  display: flex;
  position: relative;
  margin-left: 5.5px;
  width: 35.5px;
  height: 17.5px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFMAAAApCAMAAAB+1eWVAAAAM1BMVEUAAAClpaWlpaWkpKSlpaWioqKlpaWlpaWlpaWkpKSkpKSmpqalpaWlpaWmpqahoaGlpaU3uZrUAAAAEHRSTlMA89eoWhD375SKYhfkyk8biHlWUgAAALBJREFUSMfV10sOwjAQA9Dm/2vB9z8tK4ZKZAO1pcYHeIoUJePZ3kk9eIdf43zoaZtn1Ix/k+uYkbHgSkr8Jhuupk1INhrBSDyTo1DMMk5mBSf1Q6ZMMnMys4OVbmagmcFMTzO9mY5mOjPBi8p8JL65+yfddDjoJoAoMIPA3AVmXuScYYV7dziWeEfs9674PxX/vGIeKeamYr4LeoiiLwl7nfXPO5baJujz8r1DsR+9AB7Ot1kWQbpoAAAAAElFTkSuQmCC);
  background-size: cover;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_battery span {
  margin-right: 5px;
  flex: 1 1;
  display: flex;
  flex-direction: column;
  border-radius: 7px;
  overflow: hidden;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_battery span em {
  flex: 1 1;
  text-indent: -9999px;
  background: #191919;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_battery span i {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 13px;
  font-weight: 600;
  font-style: normal;
  color: #ffffff;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_battery span i a {
  display: none;
  content: "";
  width: 6.5px;
  height: 10px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAaCAYAAABVX2cEAAABGklEQVQ4jcXUPS9DURwH4NtWNF4SNosYOhglVoNBYjJZDVKDzegzkFjEF5AUgzAxGAwmFonEZGKwSwgSA/EYehN13Na9p4PffM6TX87LP0n+K6hgFVvdQgM41cxlN1AVZ74T1wxlHPqZyVhsM4AuYqEVv1OPgebwEUCvGCwKTeAlo9V+UWgE9xkQLHXaWw6gniRJDpIkGWuzfhxDKOVptdGmUVbecIdd1EJoGp8FsNZMtUIV3ERCR2Gr+UjoCaMhVkMDt5pnkTcLeS6ihGGsdYC2/4QCdLENdI2+otheBvQgfAo5oH48B9A7ZgpBKVbPaLVcGEqxqwBaj4VmA6ghz39sg7WO6WPNARAXPKbQCarRUIqdYwe9RfZ9AZCu2QHRA0dEAAAAAElFTkSuQmCC);
  background-size: cover;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_battery-charging span em {
  background: #34c759;
}

#screen .ios-bar.ios-bar-v1>.ios-right>.ios_battery-charging span i a {
  display: block;
}

/* ios bar v2 background icons */
.ios-bar-v2.white-icon .ios-time{
 color:#fff;
}
.ios-bar-v2 .ios-location-icon-v2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAMAAAC7IEhfAAABHVBMVEUAAACjo6O+vr7Gxsaenp7U1NTV1dUjIyMxMjFAQEBLS0tfX19nZ2eUlJS3t7e9vb3Dw8PBwcGurq7BwcHo6OgjIyMsLCw4ODg2NzZKSkpUVFRra2t1dXVzc3NycnJ+fn6Li4uZmZmqqqqZmZmnp6fW1tbQ0NDR1dG8vLy4uLiysrLb29tubm4dHR0zMzNlZWUrKyusrKxGRkaqqqpISEinp6dQUFBbW1umpqakpKSXl5dOTk6ioqJtbW1oaGigoKB9fX2Hh4eMjIyenp6goKCurq6Li4utra24uLitra2rq6vn5+eoqKjBwcGenp7j4+P///8AAAAFBQUODg4bGxsSEhIWFhYJCQkICAiqqqqjo6N8fHxgYGBCQkI8PDzdyyUpAAAAUXRSTlMAGAssVhoM9urf187JXzo1MyMbDw787+vm2dTGxMK8sqtRTUtDOyUhFxIQB/779PPw6eXg3NfW0M7NzczKvbqzs7Cfg3NlZVpTQUA1MjEqEgVc1275AAABdklEQVQ4y62T13LCMBBFNyH0XhIIJfSa3nvvPcIG0v//MzK7IwkHFMsPOQ+W9nLGI3EB/o3nQp+xNY9OawS7DFmy16KzTGD3ypqPDYn/qYWnmRVQM1/sCaNr4DOg1Ny5gdCMhXof16hCc2WZwDwF2MONb1yL+KU2M4UBHbU2qk2tSM0fAeQS994RrWTKG2w3eJbGMWy1UnlD3qCQEmkM555Fa1JVhHlmybcwKcoxNqzKVwELbowGL3yqpKW24YJfhDAM8eFI3uBzrKBXjN1A3Ajv+y0Zj7fanU470eLiCeZZPuSYgkUgqHBxmjmm4oF+QPTFy2qVIrXnxV0EBOWBQjwHgFsqHCwkEhOCp/IFneUYADLy1Wqi+PkBb88ENbKNXYAAriUbMYnCDtRxMcAGDxqbsIxL3k6cRGP9ntpLacXVD3wGQSu+U3tNvfjF/8wakfPoUMyAQ/HOoegFDUkuVnWihxF90GKQeKUXq+jtgwNch6HrsfAHPYGevLbwJmoAAAAASUVORK5CYII=);
  background-size: cover;
}
.ios-bar-v2.white-icon .ios-location-icon-v2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAAAsTAAALEwEAmpwYAAADUklEQVRYhc1YTW/TMBiOk35Qpm3durRICDjAaTeEOE1C4oDEcWeENCSQ2IHLxH4AiAsSBzggLhMSggNXfgP8A8SNI6C2dtrESZo2iWMj92Na89G6Tdr1kdykfu0nT17b7+sYMMakVYZ83gIYY9cRQga/HRWMMWGM1UYNzqUQQu5BCB2WgG63yy/LF+i67gFCyGUCoJTWlias0+kcY4wDNgN837+7cGG6rp8QwqfUXFjYEG9ACBssBSCEbuYCgyC4CSE0RUVQSvkwHsbZ+FzNTKDnefsQwp6oMIRQfdQXY9wJ24dztW9PJazX6z1ttVq+iCjLsqhpmm/DHHHzky+oVAL5g2zbpiLC+AvwF4njsSzrc7h9r9cfiNM2MwnTNO0PEwRCyOHBeMqLRsIOX/WzCryMEMKiwiCEBu8jMG8fJlCMtUskIAG5MykVxXjs9yyjgRCKLKphaJoskL+ZaCrCGAe2bb+aJxwlUF5MFMgfFDcn4qBpmsdDC5tz9UMI7Rjv2XFt+z+NRkNj4pBSlo040qFXI+2B4zhvSqXSscjejVJ6lVJ6g98DABAAoCtJEhmac5TSMgDAVRTlVxIHQqihqmotVOeqqnohtsMsqUkUZBB8kzwYwaTpIvNdjZQxFEXhWeZBuN4wjJNwXbvdJvl8/lsSl7y1tfVYWgB8378driuVSk/CdWtra88mEg0j+uush1nX9R9nh8pxnKO4/DxtUYH+Uh6CEHJr5IBpHgqC4JrneXuU0l3Xdfeq1er2WTvGuLm5uXlp9N8wjKBcLo99pFmW9W59ff1oqgfTFnewdxuDaZr2rGktdpFIGSCXy/0M1wEAwBnvfQzbW63W32V+F2sxdX2BhJBDVVULYWOlUrmyNIEAAC9CLMsKv1JKP4RtmqaZotxZeZBFiGVZppQeFAqF06EeYWdnZ/fcjz7kAT6F6xFCPD3+E+aRFoRCoRDLvV3Zvr+yh0cIIU+Rle8rK7BcLj+atc/SBBqGQfP5/NeVFVgsFp/P028sF88LxlgVANBMsruuywVGws3SPMgYK06y+77/cl7urDxYAwA0Jj1nXu6sUl0zyabr+pdU5Flst9jgnOVFeC9Vr9f5yVUq3swEDvd9+81ms82/cW3bfp8F538Z/yl3kBUVVwAAAABJRU5ErkJggg==);
  background-size: cover;
}

.ios-bar-v2 .ios-signal-icon-v2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAAkBAMAAAAwddR+AAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABHRSTlMA5ogGBMV9/gAAAGJJREFUKM9joC4wEnERMsAhp+Li4qKAQ04EKCeAQ84FCBxoLIdwPEIO0/EIOUzHY5WDCtJWDtPxUAqr46EUhuMx5aA86shhOhBBYToQQaE6cKhSYD9gpaB+x0pBwww7RSYAALyWaRE+YyM2AAAAAElFTkSuQmCC);
  background-size: cover;
}

.ios-bar-v2.white-icon .ios-signal-icon-v2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAAkBAMAAAAwddR+AAAAD1BMVEUAAAD///////////////+PQt5oAAAABHRSTlMA5ogGBMV9/gAAAGJJREFUKM9joC4wEnERMsAhp+Li4qKAQ04EKCeAQ84FCBxoLIdwPEIO0/EIOUzHY5WDCtJWDtPxUAqr46EUhuMx5aA86shhOhBBYToQQaE6cKhSYD9gpaB+x0pBwww7RSYAALyWaRE+YyM2AAAAAElFTkSuQmCC);
  background-size: cover;
}

.ios-bar-v2 .ios-wifi-icon-v2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD8AAAAtCAMAAAAun0N9AAAAe1BMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC9eBywAAAAKHRSTlMA8+16C9WpF+rdrWn85eNwXygiDTIuE9nMw6Shm4BZHMWPhnRWR0EFYlXd4QAAAVBJREFUSMftkkmWgyAURVEQG9TYJEYTm/Rh/yusYymIglI6qJF3+rkPPueBHSVN/cB5aPq+Geb4UTdr3O+7DOmEsHx//2Ynd5MqMe+J3j55Pp3F907Ltl1yW41f2gt6ZFAtRjRnZ5501i0KV8r0MqUeu1TAudYJ6gYoqa+OOHNjhf4xBbk6TsfHSogwP7IfDlOIgAIEhxtCeQzZzjAFM6SQ/QUEMtXvxIr5i6F3cw3DvXmQbxNbtKWSZPaCC+rlqzP+zb446MJvl3kGhJWQSrDqkeAJ5uB3yLC3aWA7SrC/0fIyFrr70vvB2BinBXqf8BrhKEFteyPMi0OAnkNnizVK++oddC4PwOmkenjQ9QEBUewVMP2/QBFu+48jtEknDm8/2aBjKoDX+7no5+v95jzo5wasxz5z3QZbsK1Ot5i+IYDp2wOsDGwnK4oM7OzM8gOvPFaPDc4nDQAAAABJRU5ErkJggg==);
  background-size: cover;
}
.ios-bar-v2.white-icon .ios-wifi-icon-v2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD8AAAAtCAMAAAAun0N9AAAAXVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9RKvvlAAAAHnRSTlMA7PPW5HoLqRfdraNxacSCXygiDTIuE8ybWUQcj1YV1L1kAAABO0lEQVRIx+2S27aCIBRFQbmoiOAlL1n8/2eeHAmhkBx5aPTQfN3OLSwW+PGVzJOgA4JKQTRQMc2n5OuI1A40Xv8pNzeovMBbE7YvhTqguBzb2agCjNmBLhMVJJHv7L5wvs2rKnd2Fr1Xr/NNWGxqyHNAmoltIs1r35tBSxbdftwJe+55S/SaYgI8EPzagNwx1nfGLXhDi3UW2DMVaiGtzYlx8QjvEWGBO5NRqhaEI+sTMLLKDG7TXItDmPm7S4m4U0KnehyV4BjClBdGAqK5o4vOJsw9OejuPeyjrbHdhsI+N5lT2ZClvZKat+AgTPm07Rq1a/V08uEFtN1Vj4Z0twcG8+6fhUi69J9KEqVzkzrkETpVFvS8P9j+cN6fU6v4MzhPlho9i9D1Aq1HLTB6/IK0B/H0VdWDH1/MHzhiQYg1Hez/AAAAAElFTkSuQmCC);
  background-size: cover;
}

.ios-bar-v2 .ios-battery-icon-v2{
  position: relative;
}
.ios-bar-v2 .ios-battery-icon-v2::before {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFMAAAApCAMAAAB+1eWVAAAAM1BMVEUAAAClpaWlpaWkpKSlpaWioqKlpaWlpaWlpaWkpKSkpKSmpqalpaWlpaWmpqahoaGlpaU3uZrUAAAAEHRSTlMA89eoWhD375SKYhfkyk8biHlWUgAAALBJREFUSMfV10sOwjAQA9Dm/2vB9z8tK4ZKZAO1pcYHeIoUJePZ3kk9eIdf43zoaZtn1Ix/k+uYkbHgSkr8Jhuupk1INhrBSDyTo1DMMk5mBSf1Q6ZMMnMys4OVbmagmcFMTzO9mY5mOjPBi8p8JL65+yfddDjoJoAoMIPA3AVmXuScYYV7dziWeEfs9674PxX/vGIeKeamYr4LeoiiLwl7nfXPO5baJujz8r1DsR+9AB7Ot1kWQbpoAAAAAElFTkSuQmCC);
  background-size: cover;
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
}
.ios-bar-v2.white-icon .ios-battery-icon-v2::before {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFMAAAApCAYAAABJCxWnAAAACXBIWXMAAAsTAAALEwEAmpwYAAAB2ElEQVRoge2bsU4CQRBAHxcLCo10xsQPoKPzCwylRksoLamxs7KT2pISS00s7UzsrOj8AIihMMFoQYeZZI4ciuyeu5jIzeuOcJvcu9m9nbm50nQ6xUEFOAHqQA3YAzb5/3wAA6AP3AM3wDhkwNISmTvAOXAKlFl/JkAXuABGMWU2gCuNyqIxBlrAdd4TkwW/XQK9gopEr7unHoJkygDtvIOsKe28QrPTvKF3xJin6TvlU5nysHku8NR2raFVn4dSOs3lqW0iF1NRP16RKX9+Kcj2J2TbtOvahya6ITeRyymrJ1wyJbMx3NR9ZEqKaLip+ayZ72uSa/9FLr/lkumsdBgzSuRMJw1/jrJbSovMsMiUEp4skwfA0CIzjG3Njm7lwCIzLDKz7poWmfE4tMiMF5lDkxlP5sSmeTxeTWY8Hk1mPO5szQxbM9O6xhOwv5FzMGOeN82CjuXAIjMsMiU3f0gr8CYzctVI6nSGG6enROe84WbgI1O6wAw3fR+Z0k5nuHF6svfmkd+bj7Uv0fiZrk8jrPUaraDXaKQNnsZ3Wr6dxNlCh7TNdXxOKhCdPB3EX6tGZyZ0Rkd9eGM97SvuaUcHqqpQ2RYUgYleb/U3Il2frqTYd0D48QmoHpYwpZM/BQAAAABJRU5ErkJggg==);
  background-size: cover;
  opacity: 0.6;
}
.ios-bar-v2 .battery-value{
  background-color:#191919;
  z-index: 1;
}

.ios-bar-v2.white-icon .battery-value{
  background-color:#fff;
}



.ios-bar-v2 .ios-battery-charging-icon-v2 {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAaCAYAAABVX2cEAAABGklEQVQ4jcXUPS9DURwH4NtWNF4SNosYOhglVoNBYjJZDVKDzegzkFjEF5AUgzAxGAwmFonEZGKwSwgSA/EYehN13Na9p4PffM6TX87LP0n+K6hgFVvdQgM41cxlN1AVZ74T1wxlHPqZyVhsM4AuYqEVv1OPgebwEUCvGCwKTeAlo9V+UWgE9xkQLHXaWw6gniRJDpIkGWuzfhxDKOVptdGmUVbecIdd1EJoGp8FsNZMtUIV3ERCR2Gr+UjoCaMhVkMDt5pnkTcLeS6ihGGsdYC2/4QCdLENdI2+otheBvQgfAo5oH48B9A7ZgpBKVbPaLVcGEqxqwBaj4VmA6ghz39sg7WO6WPNARAXPKbQCarRUIqdYwe9RfZ9AZCu2QHRA0dEAAAAAElFTkSuQmCC);
  background-size: cover;
}