.arrow-down {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/arrow-down.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/arrow-down.svg) no-repeat center / contain;
 }
.alert-triangle {
    background-color: var(--gray300);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/alert-triangle.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/alert-triangle.svg) no-repeat center / contain;
 }
 .arrow-right {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/arrow-right.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/arrow-right.svg) no-repeat center / contain;
 }
 .check-rectangle {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/check-rectangle.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/check-rectangle.svg) no-repeat center / contain;
 }
 .check {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/check.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/check.svg) no-repeat center / contain;
 }
 .close-rectangle {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/close-rectangle.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/close-rectangle.svg) no-repeat center / contain;
 }
 .close {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/close.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/close.svg) no-repeat center / contain;
}
 .lock {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/lock.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/lock.svg) no-repeat center / contain;
 }
 .person {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/person.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/person.svg) no-repeat center / contain;
 }
 .play {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/play.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/play.svg) no-repeat center / contain;
 }
 .shopkeeper {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/shopkeeper.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/shopkeeper.svg) no-repeat center / contain;
 }
 .star {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/star.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/star.svg) no-repeat center / contain;
 }
 .trending {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/trending.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/trending.svg) no-repeat center / contain;
 }
 .whatsapp {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/whatsapp.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/whatsapp.svg) no-repeat center / contain;
 }
 .facebook {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/facebook.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/facebook.svg) no-repeat center / contain;
 }
 .instagram {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/instagram.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/instagram.svg) no-repeat center / contain;
 }
 .youtube {
     background-color: var(--darkgreen);
     width: 20px;
     height: 20px;
     display: inline-block;
     -webkit-mask: url(../../img/2024/icons/youtube.svg) no-repeat center / contain;
     mask: url(../../img/2024/icons/youtube.svg) no-repeat center / contain;
 }
 .register {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/register.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/register.svg) no-repeat center / contain;
}
.search {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/search.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/search.svg) no-repeat center / contain;
}
.cookie {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/cookie.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/cookie.svg) no-repeat center / contain;
}
.document {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/document.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/document.svg) no-repeat center / contain;
}
.boleto {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/boleto.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/boleto.svg) no-repeat center / contain;
}
.pix {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/pix.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/pix.svg) no-repeat center / contain;
}
.credit {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/credit.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/credit.svg) no-repeat center / contain;
}
.copy {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/copy.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/copy.svg) no-repeat center / contain;
}
.external-link {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/external-link.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/external-link.svg) no-repeat center / contain;
}
.random {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/random.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/random.svg) no-repeat center / contain;
}
.plus {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/plus.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/plus.svg) no-repeat center / contain;
}
.discount {
    background-color: var(--lightgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/discount.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/discount.svg) no-repeat center / contain;
}
.refresh {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/refresh.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/refresh.svg) no-repeat center / contain;
}
.finalizar {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/finalizar.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/finalizar.svg) no-repeat center / contain;
}
.esquentar {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/esquentar.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/esquentar.svg) no-repeat center / contain;
}
.settings {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/settings.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/settings.svg) no-repeat center / contain;
}
.mail {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/mail.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/mail.svg) no-repeat center / contain;
}
.chat {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/chat.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/chat.svg) no-repeat center / contain;
}
.shopping {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/shopping.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/shopping.svg) no-repeat center / contain;
}
.notebook {
    background-color: var(--darkgreen);
    width: 20px;
    height: 20px;
    display: inline-block;
    -webkit-mask: url(../../img/2024/icons/notebook.svg) no-repeat center / contain;
    mask: url(../../img/2024/icons/notebook.svg) no-repeat center / contain;
}
/* =============-- ICONS DO ADMIN =============-- */

.svg.settings {
    background-color: var(--darkgreen);
    width: 18px;
    height: 18px;
    -webkit-mask: url(../../img/2024/icons/admin/settings.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/settings.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.whats {
    background-color: var(--darkgreen);
    width: 18px;
    height: 18px;
    -webkit-mask: url(../../img/2024/icons/admin/whats.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/whats.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.calendar {
    background-color: var(--darkgreen);
    width: 17px;
    height: 17px;
    -webkit-mask: url(../../img/2024/icons/admin/calendar.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/calendar.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.like {
    background-color: var(--darkgreen);
    width: 18px;
    height: 18px;
    -webkit-mask: url(../../img/2024/icons/admin/like.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/like.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.dislike {
    background-color: var(--darkgreen);
    width: 18px;
    height: 18px;
    -webkit-mask: url(../../img/2024/icons/admin/dislike.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/dislike.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.edit {
    background-color: var(--darkgreen);
    width: 18px;
    height: 18px;
    -webkit-mask: url(../../img/2024/icons/admin/edit.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/edit.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.close {
    background-color: var(--darkgreen);
    width: 12px;
    height: 12px;
    -webkit-mask: url(../../img/2024/icons/admin/close.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/close.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.copy {
    background-color: var(--darkgreen);
    width: 14px;
    height: 17px;
    -webkit-mask: url(../../img/2024/icons/admin/copy.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/copy.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.register {
    background-color: var(--darkgreen);
    width: 14px;
    height: 14px;
    -webkit-mask: url(../../img/2024/icons/admin/register.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/register.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.clock {
    background-color: #0AB19B;
    width: 14px;
    height: 14px;
    -webkit-mask: url(../../img/2024/icons/admin/clock.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/clock.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.atention {
    background-color: #E83D5A;
    width: 14px;
    height: 14px;
    -webkit-mask: url(../../img/2024/icons/admin/atention.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/atention.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}


.svg.checked {
    background-color:white;
    width: 16px;
    height: 16px;
    -webkit-mask: url(../../img/2024/icons/admin/checked.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/checked.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.doc {
    background-color:var(--darkgreen);
    width: 21px;
    height: 26px;
    -webkit-mask: url(../../img/2024/icons/admin/files.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/files.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}
.svg.garbage {
    background-color:var(--darkgreen);
    width: 21px;
    height: 26px;
    -webkit-mask: url(../../img/2024/icons/admin/garbage.svg) no-repeat 50% 50%;
    mask: url(../../img/2024/icons/admin/garbage.svg) no-repeat 50% 50%;
    -webkit-mask-size: 100% auto !important;
    mask-size: 100% auto !important;
}