@border-radius: 8px;
.tooltip-arrow,
.Hero-close {
    display: none;
}
@media @phone {
    .Dropdown-menu {
        margin: 8px !important;
        border-radius: 8px !important;
        padding: 4px !important;
    }
}
.Dropdown-menu {
    border-radius: 12px;
    padding: 1px;
    &>li {
        margin: 4px;
        &>a,
        &>button,
        &>span {
            border-radius: 8px;
            transition: 0.4s;
        }
    }
}
.Button {
    transition: background-color 0.4s;
}
.Button:active,
.Button.active,
.open>.Button.Dropdown-toggle {
    box-shadow: unset;
}
.Modal, .Modal-content {
    border-radius: 12px;
}
.backdrop {
    background-color: ~"#0000004D";
}
@media @phone {
    .dropdown-backdrop, .drawer-backdrop, .composer-backdrop {
        background-color: ~"#0000004D";
    }
}
.LoadingIndicator {
    animation: none;
    border: none;
    border-radius: 0;
    background-color: currentColor;
    --animation-image: url("data:image/svg+xml,%3Csvg viewBox='5.963 5.963 21.940666 21.940666' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'%3E%3Cg id='layer1'%3E%3Ccircle cx='16.933332' cy='16.933332' r='9.4701843' stroke='%23000' stroke-width='2' fill='none' stroke-dashoffset='' id='circlebar' stroke-dasharray='1 100'%3E %3CanimateTransform attributeName='transform' attributeType='AUTO' type='rotate' values='-95 16.933332 16.933332;355 16.933332 16.933332;985 16.933332 16.933332' dur='2s' repeatCount='indefinite' /%3E %3Canimate attributeName='stroke-dasharray' attributeType='AUTO' type='rotate' values='0.01 100;30 100;0.01 100' dur='2s' repeatCount='indefinite' /%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
    -webkit-mask: var(--animation-image);
    mask: var(--animation-image);
}
.AfruxWidgets-Widget-content {
    border-radius: 8px !important;
    background: @control-bg;
}
.Composer {
    border-radius: 12px 12px 0 0;
}
.ComposerBody-loading {
    border-radius: 12px;
}
.Post {
    border-radius: 12px;
    margin-left: 4px;
    margin-right: 4px;
    margin-top: 16px;
    margin-bottom: 16px;
    background: @control-bg;
}
.PostStream-item {
    &:not(:last-child) {
        border-bottom: none;
    }
}
.EventPost {
    background-color: transparent;
    .Post-footer {
        display: none;
    }
}
.ReplyPlaceholder {
    background: none;
    margin: auto;
    margin-top: 8px;
    width: 100%;
}
@media (min-width:992px) {
    .TagTiles>li {
        width: 30% !important;
        border-radius: 8px !important;
        margin: 15px;
    }
}
@media (max-width:991px) and (min-width:768px) {
    .TagTiles>li {
        width: 45% !important;
        border-radius: 12px !important;
        margin: 15px;
    }
}
@media (max-width:767px) {
    .TagTiles>li {
        border-radius: 12px !important;
        margin: 15px;
    }
}
.DiscussionListItem {
    margin: 0 0 8px;
    border-radius: 12px;
    background: @control-bg;
    @media @phone {
        margin: 8px !important;
    }
    &-controls .Dropdown-toggle {
        border-radius: 12px;
    }
}
.DiscussionListItem-content {
    box-shadow: unset !important;
    border-radius: 12px !important;
}
.Hero {
    margin: 15px auto 0;
    max-width: @screen-desktop-hd;
    border-radius: 12px;
    @media @desktop {
        max-width: @screen-desktop;
    }
    @media @tablet {
        max-width: @screen-tablet;
    }
    @media @phone {
        max-width: calc(~"100% - 30px");
        margin-bottom: 15px;
    }
}
.darkenBackground {
    border-radius: 12px;
}
.Post-body pre {
    font-size: 12px;
    padding: 0;
    border-left: 4px solid #929292;
    border-radius: 2px;
}
.Post-body blockquote {
    fontsize: 14px;
    padding: 10px;
    border: 0;
    border-left: 4px solid #0066d0;
    border-radius: 2px;
    & when (@config-dark-mode =false) {
        background: #f7f7f7;
        color: #444;
    }
    & when (@config-dark-mode =true) {
        background: #111111;
        color: #eee;
    }
}
.aaalert.aaerror .aainner,
.aaalert.aainfo .aainner,
.aaalert.aasuccess .aainner {
    font-size: 14px;
    text-align: left;
}
.aaalert.aaerror .aainner {
    border-left: 4px solid #ff5c5c !important;
}
.aaalert.aasuccess .aainner {
    border-left: 4px solid #58a400 !important;
}
.aaalert.aainfo .aainner {
    border-left: 4px solid #569ff7 !important;
}
ul.NotificationGroup-content {
    &>li {
        margin: 4px 8px;
        &>a {
            &.Notification {
                border-radius: 12px;
                transition: 0.4s;
            }
            &.unread .Notification-title:after {
                content: '';
                display: inline-block;
                width: 1em;
                height: 1em;
                border-radius: 50%;
                background-color: var(--primary-color);
                transform: translateY(10%);
                margin-left: 8px;
            }
        }
    }
}
.ConversationsList .chat .chat-message {
    border-radius: 0 0 @border-radius 0 !important;
}
