.strength-bar {
    display: block;
    min-height: 5px;
    width: 60px;
    border-radius: 50px;
    margin-right: 3px;
    background-color: #DDDDDD;
}

.strength-bar__default {
    background-color: #FF0000;
}

.strength-bar__orange {
    background-color: orange;
}

.strength-bar__green {
    background-color: green;
}

.svg-rank_Beginner {
    color: orange;
    fill: orange;
}

.banner-dp {
    cursor: pointer;
}

.banner-dp__items {
    position: relative;
    /* width: 250px; */
    /* height: 250px; */
    height: max-content;
    width: max-content;
    border-radius: 100%;
    /* background-color: yellowgreen; */
}

.banner-dp * img {
    border-radius: 100%;
    width: 250px;
    height: 250px;
    /* inset: 1; */
}

.banner-dp__overlay {
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    /* width: 250px;
    height: 250px; */
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: #FFFFFF;
    opacity: 0;
    /* z-index: 9999; */
}

.banner-dp__overlay:hover {
    opacity: 1;
}

.verbanner-dp {
    height: 250px;
    position: relative;
}

.verbanner-dp__items {
    /* position: relative; */
    /* width: 500px; */
    height: 250px;
    /* border-radius: 100%; */
    /* background-color: yellowgreen; */
}

.verbanner-dp * img {
    /* border-radius: 100%; */
    width: 100%;
    height: inherit;
    object-fit: contain;
    /* height: 250px; */
    /* inset: 1; */
}

.verbanner-dp__overlay {
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    /* width: 250px;
    height: 250px; */
    display: flex;
    justify-content: center;
    align-items: center;
    /* border-radius: 100%; */
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: #FFFFFF;
    opacity: 0;
    /* z-index: 9999; */
}

.verbanner-dp__overlay:hover {
    opacity: 1;
}

.asterisk {
    color: red !important;
}

/* Sidebar menu scroll (web + mobile) */
.app-sidebar.sidebar-scroll {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}

@media (max-width: 991px) {
    .app-sidebar.sidebar-scroll {
        height: calc(100vh - 65px) !important;
        max-height: calc(100vh - 65px) !important;
    }

    body.sidebar-show .app-sidebar.sidebar-scroll {
        pointer-events: auto;
    }
}

.app-sidebar .main-sidemenu {
    padding-bottom: 72px;
}

.app-sidebar.sidebar-scroll.ps {
    overflow: hidden !important;
}

.app-sidebar.sidebar-scroll.ps > .ps__rail-y {
    opacity: 0.6;
    z-index: 12;
}

.app-sidebar.sidebar-scroll.ps:hover > .ps__rail-y,
.app-sidebar.sidebar-scroll.ps.ps--scrolling-y > .ps__rail-y {
    opacity: 0.9;
}

/* Dashboard top header logo — larger on mobile/tablet */
.app-header .header-brand .header-brand-img,
.app-sidebar .desktop-logo .main-logo,
.app-sidebar .mobile-logo img {
    max-height: 48px;
    width: auto;
    max-width: 210px;
    object-fit: contain;
}

@media (max-width: 991px) {
    .app-header .header-brand .header-brand-img {
        height: 3.25rem;
        max-height: 52px;
        width: auto;
    }

    .app-header .header-brand {
        line-height: 3.25rem;
    }
}

/* Auth pages (signin/signup/reset) — allow scrolling on long forms */
body.page-style1.error-page {
    overflow-x: hidden;
    overflow-y: auto !important;
    height: auto !important;
}

body.page-style1.error-page .page {
    justify-content: flex-start !important;
    min-height: 100vh;
    height: auto !important;
    overflow: visible !important;
}

body.page-style1.error-page .page-single {
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100%;
    padding: 1rem 0 3rem;
}
