/* Heart <i class="ber-i-heart"></i> */

.ber-i-heart,
.ber-i-heart::after {
    border: 2px solid;
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
    width: 10px;
    height: 8px;
    border-bottom: 0
}
.ber-i-heart {
    box-sizing: border-box;
    position: relative;
    transform:
        translate(
            calc(-10px / 2 * var(--ggs,1)),
            calc(-6px / 2 * var(--ggs,1))
        )
        rotate(-45deg)
        scale(var(--ggs,1));
    display: block
}
.ber-i-heart::after,
.ber-i-heart::before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute
}
.ber-i-heart::after {
    right: -9px;
    transform: rotate(90deg);
    top: 5px
}
.ber-i-heart::before {
    width: 11px;
    height: 11px;
    border-left: 2px solid;
    border-bottom: 2px solid;
    left: -2px;
    top: 3px
}

/* Copy <i class="ber-i-copy"></i> */
.ber-i-copy {
    box-sizing: border-box;
    position: relative;
    display: block;
    transform: scale(var(--ggs,1));
    width: 14px;
    height: 18px;
    border: 2px solid;
    margin-left: -5px;
    margin-top: -4px
  }
  .ber-i-copy::after,
  .ber-i-copy::before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute
  }
  .ber-i-copy::before {
    background:
        linear-gradient( to left,
            currentColor 5px, transparent 0)
            no-repeat right top/5px 2px,
        linear-gradient( to left,
            currentColor 5px, transparent 0)
            no-repeat left bottom/ 2px 5px;
    box-shadow: inset -4px -4px 0 -2px;
    bottom: -6px;
    right: -6px;
    width: 14px;
    height: 18px
  }
  .ber-i-copy::after {
    width: 6px;
    height: 2px;
    background: currentColor;
    left: 2px;
    top: 2px;
    box-shadow: 0 4px 0,0 8px 0
  }

/* Copy <i class="ber-i-pen"></i> */
.ber-i-pen {
box-sizing: border-box;
position: relative;
display: block;
transform: rotate(-45deg) scale(var(--ggs,1));
width: 14px;
height: 4px;
border-right: 2px solid transparent;
box-shadow:
0 0 0 2px,
inset -2px 0 0;
border-top-right-radius: 1px;
border-bottom-right-radius: 1px;
margin-right: -2px
}
.ber-i-pen::after,
.ber-i-pen::before {
content: "";
display: block;
box-sizing: border-box;
position: absolute
}
.ber-i-pen::before {
background: currentColor;
border-left: 0;
right: -6px;
width: 3px;
height: 4px;
border-radius: 1px;
top: 0
}
.ber-i-pen::after {
width: 8px;
height: 7px;
border-top: 4px solid transparent;
border-bottom: 4px solid transparent;
border-right: 7px solid;
left: -11px;
top: -2px
}


/* Copy <i class="ber-i-trash"></i> */
.ber-i-trash {
    box-sizing: border-box;
    position: relative;
    display: block;
    transform: scale(var(--ggs,1));
    width: 10px;
    height: 12px;
    border: 2px solid transparent;
    box-shadow:
        0 0 0 2px,
        inset -2px 0 0,
        inset 2px 0 0;
    border-bottom-left-radius: 1px;
    border-bottom-right-radius: 1px;
    margin-top: 4px
}
.ber-i-trash::after,
.ber-i-trash::before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute
}
.ber-i-trash::after {
    background: currentColor;
    border-radius: 3px;
    width: 16px;
    height: 2px;
    top: -4px;
    left: -5px
}
.ber-i-trash::before {
    width: 10px;
    height: 4px;
    border: 2px solid;
    border-bottom: transparent;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    top: -7px;
    left: -2px
}

/* Copy <i class="ber-i-search"></i> */

.ber-i-search {
    box-sizing: border-box;
    position: absolute;
    display: block;
    transform: scale(var(--ggs,1));
    width: 16px;
    height: 16px;
    border: 2px solid;
    border-radius: 100%;
    margin-left: 12px;
    margin-top: 12px;
    z-index: 999;
    color: rgb(138 45 226) !important;
}

.ber-i-search::after {
     content: "";
     display: block;
     box-sizing: border-box;
     position: absolute;
     border-radius: 3px;
     width: 2px;
     height: 8px;
     background: currentColor;
     transform: rotate(-45deg);
     top: 10px;
     left: 12px;
     z-index:999;
} 

/* Copy <i class="ber-i-arrows-expand-left-alt"></i> */

.ber-i-arrows-expand-left-alt {
    box-sizing: border-box;
    position: relative;
    display: block;
    transform: scale(var(--ggs,1));
    width: 14px;
    height: 14px;
    margin: 10px;
    box-shadow: 6px 6px 0 -4px,
    -6px -6px 0 -4px;
}
.ber-i-arrows-expand-left-alt::after,
.ber-i-arrows-expand-left-alt::before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    transform: rotate(-45deg)
}
.ber-i-arrows-expand-left-alt::before {
    width: 2px;
    height: 22px;
    top: -4px;
    left: 6px;
    border-top: 9px solid;
    border-bottom: 9px solid
}
.ber-i-arrows-expand-left-alt::after {
    width: 8px;
    height: 2px;
    background: currentColor;
    top: 6px;
    left: 3px
}

/* Copy <i class="ber-i-chevron-left"></i> */

.ber-i-chevron-left {
    box-sizing: border-box;
    position: relative;
    display: block;
    transform: scale(var(--ggs,1));
    width: 22px;
    height: 22px;
    border: 2px solid transparent;
    border-radius: 100px;
	margin-left: 5px;	
}
.ber-i-chevron-left::after {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid;
    border-left: 2px solid;
    transform: rotate(45deg);
    left: 6px;
    top: 4px
}

/* Copy <i class="ber-i-flag-alt"></i> */

.ber-i-flag-alt {
    box-sizing: border-box;
    position: relative;
    display: block;
    transform: scale(var(--ggs,1));
    width: 14px;
    height: 20px;
    border-left: 2px solid
}
.ber-i-flag-alt::after,
.ber-i-flag-alt::before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    border-bottom: 2px solid
}
.ber-i-flag-alt::before {
    width: 12px;
    height: 10px;
    border-top: 2px solid;
    border-right: 2px solid transparent
}
.ber-i-flag-alt::after {
    width: 8px;
    height: 8px;
    border-left: 2px solid;
    border-top-left-radius: 2px;
    border-bottom-right-radius: 2px;
    transform: rotate(45deg);
    top: 1px;
    left: 6px
}