@charset "utf-8";

.notifications[data-v-030e0776] { color: rgb(25, 25, 26); margin-left: 16px; position: relative; }

.notifications.active[data-v-030e0776] { background-color: rgb(250, 250, 251); }

.notifications.active .triangle-up[data-v-030e0776], .notifications.active .triangle-up-line[data-v-030e0776] { display: inline-block; }

.notifications.active .menu[data-v-030e0776] { display: block; }

.notifications .slot[data-v-030e0776] { cursor: pointer; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-align: center; align-items: center; height: 84px; -webkit-box-pack: center; color: rgb(25, 25, 26); justify-content: center; position: relative; text-decoration: none; }

.notifications .slot[data-v-030e0776]:focus-visible { border-radius: 2px; outline: rgb(0, 128, 255) solid 2px; outline-offset: -1px; }

.notifications .slot .iconfont[data-v-030e0776] { display: block; font-size: 22px; height: 22px; line-height: 22px; width: 22px; }

.notifications .slot > p[data-v-030e0776] { font-size: 12px; padding-top: 2px; white-space: nowrap; }

.notifications .slot .dot[data-v-030e0776] { background-color: rgb(192, 0, 0); border-radius: 8px; height: 5px; left: 50%; position: absolute; top: 23px; transform: translateX(2px); width: 5px; }

.triangle-up[data-v-030e0776] { bottom: -8px; box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 8px 0px; height: 16px; left: 50%; transform: translateX(-50%) rotate(45deg); width: 16px; z-index: 110; }

.triangle-up[data-v-030e0776], .triangle-up-line[data-v-030e0776] { background-color: rgb(255, 255, 255); display: none; position: absolute; }

.triangle-up-line[data-v-030e0776] { bottom: -14px; height: 14px; right: 0px; width: 100%; z-index: 111; }