/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/

.settings-input-wrapper {
    position: relative;
}

.settings-input::placeholder {
    color: #333;
}

.settings-input-button {
    position: absolute;
    right: 8px;
    top: 5px;
}

.settings-input-button:disabled {
    background: gray !important;
    cursor: default !important;
}

.meetings-list {
    list-style: none;
    margin: 0;
    padding: 10px 12px;
    font-size: 14px;
    color: #253858;
    line-height: 20px;
    text-align: left;
    text-overflow: ellipsis;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: auto;
    width: 100%;
}

.meetings-list .item.with-click-handler {
    cursor: pointer;
}

.meetings-list .item:first-child {
    margin-top: 0;
}

.meetings-list .item {
    background: #fff;
    box-sizing: border-box;
    border-radius: 4px;
    display: inline-flex;
    margin: 4px 4px 4px 4px;
    min-height: 60px;
    width: calc(100% - 8px);
    word-break: break-word;
    display: flex;
    flex-direction: row;
    text-align: left;
}

.meetings-list .item:hover {
    background: #eee;
}

.meetings-list .item .right-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex-grow: 1;
    padding-left: 16px;
    padding-top: 13px;
    position: relative;
}

.meetings-list .item .left-column {
    order: -1;
    display: flex;
    flex-direction: column;
    flex-grow: 0;
    padding-left: 16px;
    padding-top: 13px;
}

.meetings-list .item .title {
    font-weight: 500;
    margin-bottom: 4px;
}

.meetings-list .item .subtitle {
    color: #5e6d7a;
    font-weight: 400;
}

.meetings-list .item .actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 0;
    margin-right: 16px
}

.meetings-list .delete-meeting {
    display: block;
    margin-right: 16px;
    position: absolute;
}


.meetings-list .item:hover .delete-meeting {
    display: block;
}

.fst_login_wrapper form#loginform .input {
    margin-top: 10px;
    padding: 10px;
    width: 100%;
}

.fst_login_wrapper input#wp-submit {
    background: #0275ff;
    border: 0;
    border-radius: 5px;
    color: #fff;
    width: 100%;
}

.bp-single-message-content a {
    color: #009FFD;
}

.gap-2 {
    gap: 2em;
}

/**
 * MEMBERS
 */

@media screen and (max-width: 1420px) {
    body.has-sidebar .buddypress-wrap .grid.bp-list.members-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (max-width: 1145px) {
    body.has-sidebar .buddypress-wrap .grid.bp-list.members-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (max-width: 1240px) {
    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list.members-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (max-width: 968px) {
    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list.members-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (max-width: 799px) {

    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list.members-list>li,
    body.has-sidebar .buddypress-wrap .grid.bp-list.members-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (max-width: 590px) {

    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list.members-list>li,
    body.has-sidebar .buddypress-wrap .grid.bp-list.members-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}


@media screen and (min-width: 55em) {
    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list.groups-list {
        grid-template-columns: repeat(auto-fit, minmax(275px, 100%));
    }

    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (min-width: 75em) {
    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list.groups-list {
        grid-template-columns: repeat(auto-fit, minmax(275px, 100%));
    }

    body:not(.has-sidebar) .buddypress-wrap .grid.bp-list>li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (min-width: 32em) {
    .buddypress-wrap .grid.bp-list>li {
        flex:0 0 100%;
        max-width: 100%
    }
}

@media screen and (min-width: 75em) {
    .buddypress-wrap .grid.bp-list>li {
        flex:0 0 100%;
        max-width: 100%
    }
}

body:not(.logged-in) #members-list.item-list.grid .list-wrap.primary-button.no-secondary-buttons {
    padding-bottom: 15px;
}

#members-list.item-list.grid .list-wrap.primary-button.no-secondary-buttons {
    padding-bottom: 15px;
}

#members-list.item-list.grid .list-wrap.primary-button.no-secondary-buttons .primary-action {
    bottom: auto !important;
}

#members-list .member-action {
    grid-column: 3 / 4;
    grid-row: 2 / 3;

    display: flex;
    flex-direction: column;
    gap: 10px;
}

#members-list .member-action .generic-button {
    margin: 0;
}

@media (max-width: 782px) {
    #members-list .member-action {
        grid-column: 1 / 3;
        grid-row: 4 / 5;

        /* flex-direction: row; */
    }

    #members-list .member-action > .primary-action {
        flex-grow: 1;
    }

    #members-list .member-action > .primary-action:last-child {
        display: none;
    }
}

/* #members-list .member-action > .primary-action:first-child > .generic-button {
    margin-top: 0;
}

#members-list .member-action > .primary-action:last-child > .generic-button {
    margin-bottom: 0;
} */

#members-list > li.item-entry {
    display: flex;
    gap: 10px;
    padding: 0 !important;
}

#members-list .list-wrap-inner {
    display: grid;
    grid-template-columns: 150px 1fr 250px;
    grid-template-rows: auto auto;
    gap: 10px 25px;
    width: 100%;
}

@media (max-width: 782px) {
    #members-list .list-wrap-inner {
        grid-template-columns: 80px 1fr;
        grid-template-rows: auto auto;
    }
}

#members-list .member-main {
    width: 100%;
}

#members-list .member-video {
    flex: 0 0 240px;
    padding: 0 !important;
    overflow: hidden !important;
}

@media (max-width: 782px) {
    #members-list .member-video {
        display: none;
    }
}

    #members-list .member-novideo {
        border: none !important;
        box-shadow: none !important;
    }

    #members-list .member-video-thumb {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        background-size: contain;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-color: black !important;
        cursor: pointer;
    }

    #members-list .member-video-thumb img {
        width: 40px;
    }

    #members-list .member-video-thumb .bb-icon-play {
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        background-color: rgba(0, 0, 0, .3);
        border-radius: 999px;
        width: 30px;
        height: 30px;
        font-size: 1.2em;
    }

#buddypress .members-list>li .primary-action .generic-button {
    margin: 0;
}

#buddypress .members-list>li .primary-action .generic-button>.send-message {
    background-color: var(--bb-primary-button-background-regular);
    color: var(--bb-primary-button-text-regular);
    border: 1px solid var(--bb-primary-button-border-regular);
}

#buddypress .members-list>li .primary-action .generic-button>.send-message:hover {
    background-color: var(--bb-primary-button-background-hover);
    color: var(--bb-primary-button-text-hover);
    border-color: var(--bb-primary-button-border-hover)
}

#buddypress .members-list>li .primary-action .generic-button>* {
    background-color: #fff;
}

#buddypress .members-list>li .primary-action .generic-button.disabled > * {
    color: #aeaeae;
    border-color: #aeaeae;
    cursor: default;
}

#buddypress .members-list>li .primary-action .generic-button.disabled:hover > * {
    background-color: transparent;
}


#members-list .member {
    flex: 1 1 auto;
}

#members-list .member-avatar {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
}

@media (max-width: 782px) {
    #members-list .list-wrap-inner {
        grid-column: 1 / 2;
        grid-row: 1 / 3;
    }
}

#members-list .member-avatar>a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

/* #members-list .member-avatar img {
            width: 185px;
            height: 185px;
        } */

#members-list .member-avatar .member-status {
    width: 16px;
    height: 16px;
    top: 14px;
    right: 14px;
}

@media (max-width: 782px) {
    #members-list .member-avatar .member-status {
        width: 14px;
        height: 14px;
        top: 2px;
        right: 2px;
    }
}

#members-list .member-header-wrapper {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
}

#members-list .member-header-wrapper .item-meta.last-activity {
    text-align: left;
    margin-bottom: 0;
}

#member-list .member-subheader {
    display: flex;
    flex-direction: row;
    gap: 12px;
}

#members-list .member-header {
    display: flex;
    flex-direction: row;
    gap: 12px;
}

    #members-list .member-name > a {
        font-weight: 600;
    }

    #members-list .member-name > a:hover {
        font-weight: 600 !important;
    }

    #members-list .member-achievements {

    }

    #members-list .member-achievements .gamipress-buddypress-achievement {
        border: 1px solid rgb(202, 202, 202);
        border-radius: 5px;
        width: 20px;
        height: 20px;
        display: inline-block;
    }

    #members-list .member-achievements .gamipress-buddypress-achievement-thumbnail {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #members-list .member-achievements .gamipress-achievement-thumbnail {
        width: 80%;
        height: 80%;
    }

    #members-list .gamipress-buddypress-proof-label {
        display: none;
    }

    #members-list .member-achievements .gamipress-buddypress-user-details {
        display: flex;
        flex-direction: row-reverse;
        gap: 10px;
    }

    #members-list .gamipress-buddypress-points {
        font-size: .8em;
        display: flex;
        gap: 10px;
    }

    #members-list .gamipress-points-thumbnail {
        width: 18px;
        vertical-align: text-bottom;
    }

#members-list .member-type {
    margin: 0 !important;
    float: none;
    text-align: left;
}

#members-list .member-info {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    font-size: .9em;
    line-height: 1.8em;
}

@media (max-width: 782px) {
    #members-list .member-info {
        order: 3;
        grid-column: 1 / 3;
        grid-row: 3 / 4;
    }
}

#members-list .member-orders {
    display: flex;
    gap: 10px;
}

#members-list .member-icon {
    display: inline-block;
    vertical-align: middle;
    width: 15px;
}

#members-list .bb-icon-l {
    font-size: 1.2em
}

#members-list .member-right {
    flex: 0 0 250px;
}

    #members-list .member-rating-price {
        grid-column: 3 / 4;
        grid-row: 1 / 2;
        display: flex;
        gap: 20px;
    }

    @media (max-width: 782px) {
        #members-list .member-rating-price {
            order: 2;
            grid-column: 2 / 3;
            grid-row: 2 / 3;
        }
    }

#members-list.item-list.grid .list-wrap.primary-button .primary-action {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
}

#members-list .primary-action .generic-button > * {
    margin-bottom: 0;
}

#members-list.item-list.grid .list-wrap.primary-button.secondary-buttons {
    padding-bottom: 15px;
}

#members-list.item-list.grid .list-wrap.secondary-buttons {
    padding-bottom: 15px;
}

#members-list .primary-action .generic-button {
    text-wrap: nowrap;
}

#members-list .member-rating {
    display: flex;
    gap: 8px;
    font-size: 1.25em;
    font-weight: 600;
}

#members-list .member-rating__icon {
    display: inline-block;
    vertical-align: text-top;
    width: 20px;
}

#members-list .bb-icon-star-fill {
    font-size: 1.1em;
}

#members-list .member-reviews {
    font-size: .8em;
    color: #7f7f7f;
}

#members-list .member-price {
    font-size: 1.25em;
    font-weight: 600;
}

#members-list .member-lesson {
    font-size: .8em;
    color: #7f7f7f;
}

body.members #primary {
    max-width: 100% !important;
}

#members_intro {
    font-size: 1.2em;
    margin-bottom: 1.2em;
}

.members_skill_title {
    display: inline-block;
}

/**
 * DROPDOWN WITH CHECKBOXES
 */

.multi-select-wrapper {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    position: relative;

    height: 60px;

    font-size: 0.875em;
    padding: 0.0em 0.6em;
    min-width: 0;
    white-space: nowrap;
    /* overflow: hidden; */
    text-overflow: ellipsis;
    vertical-align: -0.5em;
    background-color: #fff;
    border: 1px solid rgb(214, 217, 221);
    border-radius: 4px;
    cursor: pointer;
}

.multi-select-wrapper:hover,
.multi-select-wrapper.active {
    border-color: #2e2e2e;
    box-shadow: 0px 0px 4px 0px rgba(180, 180, 180, 0.849);
    z-index: 1000;
}


    .overlay {
        background: rgba(0, 0, 0, .3);
        bottom: 0;
        left: 0;
        position: fixed;
        right: 0;
        top: 0;
        z-index: 999;
    }

    .multi-select-wrapper > label {
        color: #a6a6a6;
        position: relative;
        margin-bottom: 0;
        max-width: 100%;
        overflow: hidden;
    }

    .multi-select-clear {
        display: block;
        position: absolute;
        right: 8px;
        top: 0;
        font-size: 1.5em;
        cursor: pointer;
        z-index: 100;
    }

    @media (max-width: 782px) {
        .multi-select-wrapper,
        .members-subfilter {
            display: none;
        }

        .multi-select-wrapper:first-child {
            display: flex;
        }
    }

.multi-select-container {
    display: inline-block;
    position: relative;
}

    .multi-select-container > span {
        display: inline-block;
        width: 100%;
        overflow: hidden;
    }

.multi-select-menu {
    position: absolute;
    left: -9px;
    top: 33px;
    z-index: 1000;
    float: left;
    min-width: 100%;
    background: #fff;
    /* margin: 1em 0; */
    border: 1px solid #aaa;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    display: none;
}

.multi-select-menuitem {
    display: block;
    font-size: 0.875em;
    padding: 0.3em 1em 0.3em 30px;
    white-space: nowrap;
    margin: 0;
}

    .multi-select-menuitem:hover {
        background: #1967d2;
        color: white;
    }

.multi-select-legend {
    font-size: 0.875em;
    font-weight: bold;
    padding-left: 10px;
}

/* .multi-select-legend + .multi-select-menuitem {
    padding-top: 0.25rem;
}

.multi-select-menuitem + .multi-select-menuitem {
    padding-top: 0;
} */

.multi-select-presets {
    border-bottom: 1px solid #ddd;
}

.multi-select-menuitem input {
    position: absolute;
    margin-top: 0.5em;
    margin-left: -20px;
}

.multi-select-button {
    display: inline-block;
    font-size: 0.875em;
    padding: 0.2em 0.6em;
    max-width: 16em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: -0.5em;
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    cursor: default;
}

.multi-select-button:after {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.4em 0.4em 0 0.4em;
    border-color: #999 transparent transparent transparent;
    margin-left: 0.4em;
    vertical-align: 0.1em;
}

.multi-select-container--open .multi-select-menu {
    display: block;
}

.multi-select-container--open .multi-select-button:after {
    border-width: 0 0.4em 0.4em 0.4em;
    border-color: transparent transparent #999 transparent;
}

.multi-select-container--positioned .multi-select-menu {
    /* Avoid border/padding on menu messing with JavaScript width calculation */
    box-sizing: border-box;
}

.multi-select-container--positioned .multi-select-menu label {
    /* Allow labels to line wrap when menu is artificially narrowed */
    white-space: normal;
}




.demo-example > label {
    display: block;
    margin-bottom: 0.5em;
    font-weight: bold;
}

.position-menu-within {
    width: 18em;
    height: 15em;
    background: #eee;
    overflow: auto;
    padding: 2em 0 0 2em;
}

.modal-example .multi-select-menu {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 50%;
    min-width: 0;
    overflow: auto;
    border: none;
    border-radius: 0.3em;
    box-shadow: 0 1em 3em rgba(0,0,0,0.4);
}

.modal-example .multi-select-menuitem {
    font-size: 1em;
    padding: 1.5em 2.5em 1.5em 3.5em;
}

.modal-example .multi-select-menuitem + .multi-select-menuitem {
    padding-top: 0;
}

.modal-example .multi-select-menuitem input {
    margin-left: -2.5em;
}

.multi-select-modal {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.4);
    display: none;
}

.multi-select-container--open .multi-select-modal {
    display: block;
}

#filter-rate .multi-select-menu {
    width: 16em !important;
    height: 5em;
    padding: 2em;
}

#filter-keywords,
#filter-keywords:focus {
    padding: 0;
    border: none;
    box-shadow: none !important;
    margin: 0;
    height: auto;
}

#member-filters {
    margin: 0;
    display: flex;
    gap: 1.5em;
    width: 100%;
}


@media (max-width: 782px) {
    #member-filters {
        gap: 10px;
    }
}

.members-nav {
    font-weight: bold;
}

.members .bp-navs ul li.selected {
    display: flex;
}

.members .bp-navs ul li.selected .count {
    background: transparent;
    border: none;
    font-size: inherit;
    padding: 0 .5em 0 0;
    margin: 0;
}

.members .bp-navs.bp-subnavs {
    font-size: inherit;
}

/**
 * NoUISlider
 */

/* Functional styling;
 * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */

.noUi-target,
.noUi-target * {
-webkit-touch-callout: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-user-select: none;
-ms-touch-action: none;
touch-action: none;
-ms-user-select: none;
-moz-user-select: none;
user-select: none;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.noUi-target {
position: relative;
}
.noUi-base,
.noUi-connects {
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
/* Wrapper for all connect elements.
*/
.noUi-connects {
overflow: hidden;
z-index: 0;
}
.noUi-connect,
.noUi-origin {
will-change: transform;
position: absolute;
z-index: 1;
top: 0;
right: 0;
height: 100%;
width: 100%;
-ms-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
-webkit-transform-style: preserve-3d;
transform-origin: 0 0;
transform-style: flat;
}
/* Offset direction
*/
.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {
left: 0;
right: auto;
}
/* Give origins 0 height/width so they don't interfere with clicking the
* connect elements.
*/
.noUi-vertical .noUi-origin {
top: -100%;
width: 0;
}
.noUi-horizontal .noUi-origin {
height: 0;
}
.noUi-handle {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
position: absolute;
}
.noUi-touch-area {
height: 100%;
width: 100%;
}
.noUi-state-tap .noUi-connect,
.noUi-state-tap .noUi-origin {
-webkit-transition: transform 0.3s;
transition: transform 0.3s;
}
.noUi-state-drag * {
cursor: inherit !important;
}
/* Slider size and handle placement;
*/
.noUi-horizontal {
height: 18px;
}
.noUi-horizontal .noUi-handle {
width: 34px;
height: 28px;
right: -17px;
top: -6px;
}
.noUi-vertical {
width: 18px;
}
.noUi-vertical .noUi-handle {
width: 28px;
height: 34px;
right: -6px;
bottom: -17px;
}
.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {
left: -17px;
right: auto;
}
/* Styling;
* Giving the connect element a border radius causes issues with using transform: scale
*/
.noUi-target {
background: #FAFAFA;
border-radius: 4px;
border: 1px solid #D3D3D3;
box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB;
}
.noUi-connects {
border-radius: 3px;
}
.noUi-connect {
background: #3FB8AF;
}
/* Handles and cursors;
*/
.noUi-draggable {
cursor: ew-resize;
}
.noUi-vertical .noUi-draggable {
cursor: ns-resize;
}
.noUi-handle {
border: 1px solid #D9D9D9;
border-radius: 3px;
background: #FFF;
cursor: default;
box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;
}
.noUi-active {
box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;
}
/* Handle stripes;
*/
.noUi-handle:before,
.noUi-handle:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 1px;
background: #E8E7E6;
left: 14px;
top: 6px;
}
.noUi-handle:after {
left: 17px;
}
.noUi-vertical .noUi-handle:before,
.noUi-vertical .noUi-handle:after {
width: 14px;
height: 1px;
left: 6px;
top: 14px;
}
.noUi-vertical .noUi-handle:after {
top: 17px;
}
/* Disabled state;
*/
[disabled] .noUi-connect {
background: #B8B8B8;
}
[disabled].noUi-target,
[disabled].noUi-handle,
[disabled] .noUi-handle {
cursor: not-allowed;
}
/* Base;
*
*/
.noUi-pips,
.noUi-pips * {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.noUi-pips {
position: absolute;
color: #999;
}
/* Values;
*
*/
.noUi-value {
position: absolute;
white-space: nowrap;
text-align: center;
}
.noUi-value-sub {
color: #ccc;
font-size: 10px;
}
/* Markings;
*
*/
.noUi-marker {
position: absolute;
background: #CCC;
}
.noUi-marker-sub {
background: #AAA;
}
.noUi-marker-large {
background: #AAA;
}
/* Horizontal layout;
*
*/
.noUi-pips-horizontal {
padding: 10px 0;
height: 80px;
top: 100%;
left: 0;
width: 100%;
}
.noUi-value-horizontal {
-webkit-transform: translate(-50%, 50%);
transform: translate(-50%, 50%);
}
.noUi-rtl .noUi-value-horizontal {
-webkit-transform: translate(50%, 50%);
transform: translate(50%, 50%);
}
.noUi-marker-horizontal.noUi-marker {
margin-left: -1px;
width: 2px;
height: 5px;
}
.noUi-marker-horizontal.noUi-marker-sub {
height: 10px;
}
.noUi-marker-horizontal.noUi-marker-large {
height: 15px;
}
/* Vertical layout;
*
*/
.noUi-pips-vertical {
padding: 0 10px;
height: 100%;
top: 0;
left: 100%;
}
.noUi-value-vertical {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
padding-left: 25px;
}
.noUi-rtl .noUi-value-vertical {
-webkit-transform: translate(0, 50%);
transform: translate(0, 50%);
}
.noUi-marker-vertical.noUi-marker {
width: 5px;
height: 2px;
margin-top: -1px;
}
.noUi-marker-vertical.noUi-marker-sub {
width: 10px;
}
.noUi-marker-vertical.noUi-marker-large {
width: 15px;
}
.noUi-tooltip {
display: block;
position: absolute;
border: 1px solid #D9D9D9;
border-radius: 3px;
background: #fff;
color: #000;
padding: 5px;
text-align: center;
white-space: nowrap;
}
.noUi-horizontal .noUi-tooltip {
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
left: 50%;
bottom: 120%;
}
.noUi-vertical .noUi-tooltip {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
top: 50%;
right: 120%;
}
.noUi-horizontal .noUi-origin > .noUi-tooltip {
-webkit-transform: translate(50%, 0);
transform: translate(50%, 0);
left: auto;
bottom: 10px;
}
.noUi-vertical .noUi-origin > .noUi-tooltip {
-webkit-transform: translate(0, -18px);
transform: translate(0, -18px);
top: auto;
right: 28px;
}

#filter-rate-slider {
    height: 2px;
}

#filter-rate-slider .noUi-connect {
    background: #000;
}

#filter-rate-slider .noUi-handle {
    height: 18px;
    width: 18px;
    top: -9px;
    right: -9px; /* half the width */
    border: none;
    border-radius: 4px;
    background: #000;
    box-shadow: none;
}

    #filter-rate-slider .noUi-handle::before {
        display: none;
    }

    #filter-rate-slider .noUi-handle::after {
        display: none;
    }

#filter-rate-slider .noUi-tooltip {
    display: block;
    position: absolute;
    top: 17px;
    border: none;
    /* border-radius: 3px; */
    background: transparent;
    color: #000;
    padding: 0;
    text-align: center;
    white-space: nowrap;
}

.filter-buttons {
    display: flex;
    flex-direction: column-reverse;
    flex-grow: 0;
    flex-basis: auto;
    align-items: flex-end;
    gap: 10px;
}

#filter-submit {
    padding: 7px 20px;
    background-color: #fff;
    color: inherit;
}

    #filter-submit:hover {
        background-color: #2e2e2e;
        color: #fff;
    }

#filter-reset,
#filter-mobile-reset,
#filter-mobile-overlay-close {
    border: none;
    background: transparent;
    display: block;
    padding: 0;
    color: inherit;
    font-size: 1em;
}

#filter-mobile {
    display: none;
    height: 100%;
    background-color: #fff;
    color: inherit;
    font-size: 1.5em;
}

@media (max-width: 782px) {
    .filter-buttons {
        flex-direction: row;
        gap: 10px;
    }

    #filter-reset {
        display: none;
    }

    #filter-submit {
        height: 100%;
    }

    #filter-mobile {
        display: block;
    }
}

.video-popup .modal-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
}

.video-popup .modal-video {
    max-width: 50vw;
    max-height: 60vh;
}

/* External (YouTube/Vimeo) iframe lacks intrinsic dimensions, so we set
 * an explicit responsive 16:9 box. The min() clamps to whichever axis
 * runs out first (50vw on wide screens, 60vh * 16/9 on tall narrow ones). */
.video-popup .modal-video--external {
    width: min(80vw, calc(70vh * 16 / 9));
    aspect-ratio: 16 / 9;
    height: auto;
    border: 0;
}

@media (min-width: 768px) {
    .video-popup .modal-video--external {
        width: min(60vw, calc(70vh * 16 / 9));
    }
}


/* Skeleton Loader CSS */
.skeleton {
    background: #eee;
    background: linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%);
    border-radius: 5px;
    background-size: 200% 100%;
    animation: 1.5s shine linear infinite;
}

@keyframes shine {
    to {
        background-position-x: -200%;
    }
}

.member-avatar .skeleton {
    width: 150px;
    height: 150px;
    border-radius: 50%;
}

.member-header .skeleton {
    width: 200px;
    height: 20px;
    margin-bottom: 8px;
}

.member-info .skeleton {
    width: 100%;
    height: 15px;
    margin-bottom: 8px;
}

.member-action .skeleton {
    width: 100%;
    height: 40px;
    border-radius: 4px;
    margin-bottom: 10px;
}

.entry-title {
    line-height: 1.2em;
}

.members-nav {
    display: flex;
    flex-grow: 1;
    flex-basis: 0;
    width: 16em;
    white-space: nowrap;
}

    .members-nav .count {
        background: transparent;
        border: none;
        font-size: inherit;
        color: inherit;
        box-shadow: none;
        padding: 0 .5em 0 0;
        margin: 0;
    }

.members-subfilter {
    display: flex;
    flex-grow: 0;
    flex-basis: auto;
    align-items: flex-end;
}

#filter-mobile-overlay {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 20px;
    background: white;
    z-index: 9999;
}

.admin-bar #filter-mobile-overlay {
    top: 32px;
}

@media screen and (max-width: 782px) {
    .admin-bar #filter-mobile-overlay {
        top: 46px;
        height: calc(100% - 46px);
    }
}

/* Mobile admin bar: the left plugin icons (Yoast, WCFM, comments, etc.) fill the
   row, so the right-floated account group cannot fit and wraps below the bar.
   Pin it to the top-right corner instead of letting it drop out. */
@media screen and (max-width: 782px) {
    #wpadminbar #wp-admin-bar-top-secondary {
        position: absolute;
        top: 0;
        right: 0;
    }

    /* The absolute parent above would become the dropdown's containing block and
       squash it to the group width; force the menu back to full bar width. */
    #wpadminbar #wp-admin-bar-top-secondary > li > .ab-sub-wrapper {
        position: fixed;
        top: 46px;
        left: 0;
        right: 0;
    }

    /* Tighten the icon-only items (all but the wider Yoast/WCFM menus) from 52px
       to 50px so the row packs in and visually clears the pinned account group. */
    #wpadminbar #wp-admin-bar-root-default > li:not(#wp-admin-bar-wpseo-menu):not(#wp-admin-bar-wcfm-menu) > .ab-item,
    #wpadminbar #wp-admin-bar-root-default > li:not(#wp-admin-bar-wpseo-menu):not(#wp-admin-bar-wcfm-menu) > .ab-item::before {
        width: 50px;
    }
}

    #filter-mobile-overlay .header {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        gap: 10px;
    }

        #filter-mobile-overlay .header .title {
            grid-column: 1 / 2;
            grid-row: 1 / 2;
        }

            #filter-mobile-overlay .header .title h2 {
                margin-bottom: 0;
            }

        #filter-mobile-overlay .header .close {
            grid-column: 2 / 3;
            grid-row: 1 / 2;
            display: flex;
            justify-content: flex-end;
        }

            #filter-mobile-overlay-close {
                font-size: 2.2em;
            }

            #filter-mobile-reset {
                border: 1px solid rgb(214, 217, 221);
                font-size: 1em;
                padding: 10px 20px;
            }

        #filter-mobile-overlay .header .reset {
            grid-column: 1 / 2;
            grid-row: 2 / 3;
        }
    

        #filter-mobile-submit {
            width: 100%;
        }

        #filter-mobile-overlay .content {
            display: flex;
            flex-direction: column;
            gap: 30px;
        }

        #filter-mobile-overlay .content > * {
            display: flex;
            border: none;
            width: 100%;
        }

        #filter-mobile-overlay .multi-select-wrapper.active {
            box-shadow: none;
            z-index: auto;
        }

        #filter-mobile-overlay .multi-select-wrapper > label {
            overflow: unset;
        }

        #filter-mobile-overlay #filter-rate-component {
            margin-bottom: 10px;
        }

        #filter-mobile-overlay #filter-rate-component #filter-rate-dropdown {
            display: block;
            position: relative;
            width: 100% !important;
            height: auto;
            left: auto;
            top: auto;
            z-index: auto;
            float: none;
            margin: 0;
            padding: 1em .5em;
            border: none;
            box-shadow: none;
        }

        #filter-mobile-overlay #filter-rate-component #filter-rate > span {
            display: none;
        }

        #filter-mobile-overlay #filter-language-component .multi-select-container > span {
            border: 1px solid #a6a6a6;
            border-radius: 4px;
            padding: 5px 10px;
            position: relative;
        }

            #filter-mobile-overlay #filter-language-component .multi-select-container > span::after {
                display: block;
                font-family: bb-icons;
                content: '\e826';
                font-size: 1.2em;
                color: #a6a6a6;
                position: absolute;
                top: 5px;
                right: 8px;
                width: 1em;
            }

        #filter-mobile-overlay #filter-language-component .multi-select-menu {
            left: 0;
            top: 38px;
        }

        #filter-mobile-overlay #filter-keywords-component {
            margin-bottom: 16px;
        }

        #filter-mobile-overlay #filter-keywords-component input {
            border: 1px solid #a6a6a6;
            border-radius: 4px;
            padding: 10px 10px 10px 20px;
            position: relative;
        }

            #filter-mobile-overlay #filter-keywords-component .bb-icon-l {
                display: none;
            }

            #filter-mobile-overlay #filter-keywords-component input::before {
                display: block;
                font-family: bb-icons;
                content: '\ef10';
                font-size: 1.2em;
                color: #a6a6a6;
                position: absolute;
                top: 5px;
                left: 8px;
                width: 1em;
            }



.members-nav-subfilter {
    display: flex;
    flex-direction: row;
}

@media (max-width: 782px) {
    .members-nav-subfilter {
        flex-direction: column;
        gap: 10px;
    }
}

#page-loader {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(46, 46, 46, 0.8);
    z-index: 99999;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    font-size: 30px;
    font-family: "Trebuchet MS", sans-serif;
    font-weight: 600;
    line-height: 100vh;
    opacity: 0;
    transition: opacity 0.3s ease;
}

#page-loader.show {
    display: block;
    opacity: 1;
}

.top-banner {
    width: 100%;
    background-color: #2e2e2e;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: 0;
    z-index: 999;
    padding: 5px 0;
}

    .top-banner .top-banner__content {
        max-width: 960px;
        margin: 0 auto;
        padding: 0 10px;
        display: grid;
        grid-template-columns: auto 1fr auto;
        grid-template-rows: 1fr;
        grid-column-gap: 50px;
        grid-row-gap: 0px;
        justify-content: center;
        align-items: center;
    }

    .top-banner .top-banner__image {
        grid-area: 1 / 1 / 2 / 2;
    }

    .top-banner .top-banner__image img {
        max-width: 92px;
        max-height: 92px;
    }

    .top-banner .top-banner__text {
        grid-area: 1 / 2 / 2 / 3;
        font-weight: bold;
        font-size: 16px;
        color: #ffffff;
    }

    .top-banner .top-banner__button {
        grid-area: 1 / 3 / 2 / 4;
    }

    .top-banner .top-banner__button .button {
        color: #fff;
    }

    @media screen and (max-width: 782px) {
        .top-banner .top-banner__content {
            grid-template-columns: auto 1fr;
            grid-template-rows: repeat(2, 1fr);
            grid-column-gap: 20px;
            grid-row-gap: 0px;
            padding: 10px;
        }

        .top-banner .top-banner__image {
            grid-area: 1 / 1 / 3 / 2;
        }

        .top-banner .top-banner__text {
            grid-area: 1 / 2 / 2 / 3;
            justify-self: end;
        }

        .top-banner .top-banner__button {
            grid-area: 2 / 2 / 3 / 3;
            justify-self: end;
        }
    }

body.bp-search .site-header {
    z-index: 999;
}

body.bp-search .site-header .site-header-container {
    width: auto !important;
}

.last-message-bubble__close-icon {
    transform: scale(1.5) !important;
}

.bb-mobile-panel-wrapper {
    height: 100vh !important;
}

.wcml-dropdown-click {
    width: auto !important;
    transform: scale(.8);
}

.wcml-cs-active-currency {
    border-radius: 4px;
}

.wcml-cs-submenu {
    box-shadow: 0 3px 8px rgba(0, 0, 0, .06), 0 6px 24px rgba(0, 0, 0, .12);
}

.site-header #primary-navbar .primary-menu .menu-item > .ab-submenu {
    min-width: 100%;
    left: auto;
}

.bb-mobile-panel-inner .wcml-horizontal-list > ul {
    display: flex;
    flex-flow: wrap;
    width: 100%;
    padding: 0 20px;
    margin: 0 0 40px !important;
    list-style-type: none;
}

.bb-mobile-panel-inner .wcml-horizontal-list li {
    width: 58px;
    white-space: nowrap;
    display: block;
}

.bb-mobile-panel-inner .wcml-cs-active-currency {
    font-weight: bold;
}

@keyframes shake-phone {
    0%   { transform: rotate(0deg); }
    2%   { transform: rotate(15deg); }
    4%   { transform: rotate(-15deg); }
    6%   { transform: rotate(10deg); }
    8%   { transform: rotate(-10deg); }
    10%  { transform: rotate(5deg); }
    12%  { transform: rotate(-5deg); }
    14%  { transform: rotate(2deg); }
    16%  { transform: rotate(-2deg); }
    18%  { transform: rotate(1deg); }
    20%  { transform: rotate(0deg); }
  
    /* Остальные 80% времени — "покой" */
    100% { transform: rotate(0deg); }
}
  
#meeting-call-button i {
    display: inline-block;
    animation: shake-phone 5s ease-in-out infinite;
}

/* Остановка анимации при наведении */
#meeting-call-button:hover i {
    animation-play-state: paused;
}

.use-phone {
    font-size: 12px;
    line-height: 1.2em;
    margin: 20px 20px 0;
}

/* On phones the composer area is tight — the meeting notice shrinks to a hint. */
@media (max-width: 640px) {
    .use-phone {
        font-size: 10px;
        margin: 10px 20px 0;
    }
}

#bp-message-content {
    margin-top: 5px !important;
}

.toast-messages-content .senders {
    display: inline;
}

/* Partner status */
.member-status {
    z-index: 2;
}

.avatar-wrapper {
    position: relative;
    display: inline-block;
}

.avatar-wrapper.status-ready::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    aspect-ratio: 1 / 1;
    background: url('/wp-content/themes/buddyboss-theme-child/assets/images/avatar_overlay_ready_to_work.png') no-repeat center;
    background-size: contain;
    pointer-events: none;
    z-index: 2;
}

.avatar-wrapper img.avatar {
    display: block;
    position: relative;
    z-index: 1;
}

.toggle-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #2e2e2e;
    margin-bottom: 10px;
}

.toggle-wrapper .toggle {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 17px;
}

.toggle-wrapper .toggle input {
    display: none;
}

.toggle-wrapper .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ef5455;
    transition: 0.2s;
    border-radius: 17px;
}

.toggle-wrapper .slider:before {
    position: absolute;
    content: "";
    height: 13px;
    width: 13px;
    left: 2px;
    bottom: 2px;
    background-color: #fff;
    transition: 0.2s;
    border-radius: 50%;
}

.toggle-wrapper .toggle input:checked + .slider {
    background-color: #14b550;
}

.toggle-wrapper .toggle input:checked + .slider:before {
    transform: translateX(13px);
}

.active-period {
    margin-bottom: 6px;
}

.tutor-course-category-description {
    margin-top: 2.2em;
}

.woocommerce li.product .add_to_cart_button {
    order: 2;
    flex: 1;
    margin-top: auto;
    float: right;
    align-items: center;
    justify-content: center;
    align-self: flex-end;
    box-shadow: none;
}

.woocommerce li.product .add_to_cart_button {
    border: none;
    border-radius: 0;
    border-bottom-right-radius: var(--bb-block-radius);
    border-bottom-left-radius: var(--bb-block-radius);
    border-top: 1px solid var(--bb-content-border-color);
    order: 2;
    width: 50%;
    max-height: 50px;
    margin-top: auto;
    float: right;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 12px;
    line-height: 2.5;
    text-align: center;
    min-height: auto;
    white-space: nowrap;
    overflow: hidden;
    padding: .618em 1em;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.woocommerce li.product .add_to_cart_button.added,
.woocommerce li.product .add_to_cart_button.loading {
    border-bottom-left-radius: 0;
}

.woocommerce li.product .add_to_cart_button.loading::after {
    position: static;
    margin-left: .53em;
}

.woocommerce ul.products li.product {
    overflow: hidden;
}

.woocommerce ul.products li.product .button {
    margin-top: auto;
}

.woocommerce li.product_cat-uncategorized a.added_to_cart.wc-forward,
.woocommerce li.product_cat-courses a.added_to_cart.wc-forward {
    width: 100%;
    border-right: none;
}

.woocommerce .tutor-icon-cart-line {
    position: relative;
}

.woocommerce .cart-quantity-count {
    display: block;
    position: absolute;
    background: var(--bb-primary-color);
    color: #fff;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    font-size: 9px;
    line-height: 1.6;
    min-width: 14px;
    padding: 0px 3px;
    height: 14px;
    border-radius: 9999px;
    top: -6px;
    right: -6px;
}

.woocommerce-pagination a.prev:before,
.woocommerce-pagination a.next:before {
    font-size: 18px;
    line-height: 18px;
}

button.tutor-btn {
    box-shadow: none;
}

@media (min-width: 800px) {
    .comment-form-author, .comment-form-email {
        width: calc(50% - 13.33px);
    }
}

#respond .comment-form-email {
    margin-right: 0;
}

.fbs_assignee_tooltip .user-actions,
.fbs_board_member_info .user-actions {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-top: 4px;
}

.user-actions .message-link,
.user-actions .call-link {
    background-color: var(--bb-primary-button-background-regular);
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    transition: background-color linear .1s;
    font-weight: normal;
    font-size: 12px;
}

.user-actions .message-link:hover,
.user-actions .call-link:hover {
    background-color: var(--bb-primary-button-background-hover);
    color: #fff;
}

.user-actions .message-link:before,
.user-actions .call-link:before {
    display: inline-block;
    content: "\eee7";
    font-family: bb-icons;
    font-size: 12px;
    font-weight: 300;
    line-height: 1.2;
    margin-right: .5em;
}

.user-actions .call-link:before {
    content: '\eeee';
}

.bb-onscreen-notification-enable .bb-onscreen-notification {
    z-index: 10000;
}


/**
 * Quick Message module
 */
.bb-quick-message-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
}

.bb-qm-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999998;
}

.bb-modal-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    border-radius: 12px;
    width: 90%;
    max-width: 450px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    padding: 25px;
    animation: bbModalSlideIn 0.3s ease-out;
    z-index: 999999;
}

@keyframes bbModalSlideIn {
    from {
        opacity: 0;
        transform: translate(-50%, -45%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

.bb-modal-close {
    position: absolute;
    top: -20px;
    right: -20px;
    width: 35px;
    height: 35px;
    background-color: rgb(239, 84, 85) !important;
    border: none !important;
    border-radius: 999px;
    color: #fff !important;
    font-size: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
    transition: all 0.2s linear;
    font-family: "Trebuchet MS", sans-serif;
    font-weight: 400;
    line-height: 1;
    padding: 0;
    margin: 0;
    -webkit-font-smoothing: antialiased;
}

.bb-modal-close:hover {
    background: rgb(229, 74, 75);
}

.bb-modal-header {
    margin-bottom: 15px;
}

.bb-modal-header h4 {
    margin: 0;
    font-size: 14px;
    color: #666;
    font-weight: normal;
}

.bb-modal-body {
    margin: 0;
}

.bb-message-input-wrapper {
    display: flex;
    gap: 10px;
    align-items: flex-end;
}

.bb-message-input {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid #ddd;
    border-radius: 20px;
    font-size: 14px;
    font-family: inherit;
    resize: none;
    outline: none;
    transition: border-color 0.2s;
    line-height: 1.4;
    min-height: 40px;
    max-height: 120px;
    overflow-y: auto;
    box-shadow: none;
}

.bb-message-input:focus {
    border: 1px solid #999;
}

.bb-send-button {
    padding: 10px 20px;
    /* background: #4CAF50; */
    color: white;
    border: none;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    min-width: 70px;
}

.bb-send-button:hover {
    /* background: #45a049; */
}

.bb-send-button:active {
    transform: scale(0.95);
}

.bb-send-button:disabled {
    background: #ccc;
    cursor: not-allowed;
    transform: none;
}

.bb-modal-feedback {
    text-align: center;
    padding: 20px 0;
}

.bb-feedback-icon {
    display: block;
    font-size: 48px;
    margin-bottom: 10px;
    line-height: 1;
}

.bb-feedback-icon.success {
    color: #4CAF50;
    animation: bbSuccessPulse 0.5s ease-out;
}

.bb-feedback-icon.error {
    color: #f44336;
    animation: bbErrorShake 0.5s ease-out;
}

@keyframes bbSuccessPulse {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes bbErrorShake {
    0%, 100% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(-10px);
    }
    75% {
        transform: translateX(10px);
    }
}

.bb-feedback-text {
    display: block;
    font-size: 14px;
    color: #333;
}

/* Scrollbar styling for textarea */
.bb-message-input::-webkit-scrollbar {
    width: 6px;
}

.bb-message-input::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.bb-message-input::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

.bb-message-input::-webkit-scrollbar-thumb:hover {
    background: #999;
}


/* Back button */
.back-button-wrap {
    display: block !important;
}

.back-button {
    position: fixed;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
    z-index: 9999;
    opacity: 0.7;
    background-color: var(--e-global-color-primary);
    border-radius: 8px;
    transition: opacity 0.3s ease;
}

.back-button:hover {
    opacity: 1;
}

.back-button svg {
    fill: #ffffff;
    width: 15px;
    height: 15px;
}

.tutor-pagination-content-appendable {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.direct-checkout-ajax.is_loading {
  color: #fff;
  animation: pulse-bg 1.2s ease-in-out infinite;
  cursor: not-allowed;
  pointer-events: none;
  box-shadow: 0 0 0 0 rgba(239, 84, 85, 0.0);
  border: none !important;
}

@keyframes pulse-bg {
  0% {
    background-color: #ef5455;
    box-shadow: 0 0 0 0 rgba(239, 84, 85, 0.18);
  }
  50% {
    background-color: #f57a7b; /* slightly lighter */
    box-shadow: 0 0 0 6px rgba(239, 84, 85, 0.10);
  }
  100% {
    background-color: #ef5455;
    box-shadow: 0 0 0 0 rgba(239, 84, 85, 0.18);
  }
}

@media (prefers-reduced-motion: reduce) {
  .direct-checkout-ajax.is_loading {
    animation: none;
    background-color: #ef5455;
    box-shadow: none;
  }
}

.user-nicename {
    font-weight: normal;
    font-size: 1.8rem;
}

/* Top skill subtitle under the user name on the single profile page. */
.user-top-skill {
    font-size: inherit;
}


/* Style button to look like original link */
.woocommerce button.remove {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: inherit;
    font: inherit;
    line-height: normal;
}

.woocommerce button.remove:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

button.remove.remove_from_cart_button {
    border: none;
    order: 4;
}

.product-remove button.remove {
    border: none;
    padding: 5px;
    display: flex;
    width: 25px;
    height: 25px;
}

button.remove.remove_from_cart_button:hover,
.product-remove button.remove:hover {
    background: transparent;
    opacity: 0.5;
}

.notification-list .bb-full-link {
    display: none;
}

.woocommerce-checkout .bb-wc-co table.shop_table td.product-name {
    width: 80%;
    padding-right: 0;
}

.woocommerce-checkout .bb-wc-co table.shop_table td.product-total {
    width: 20%;
}

.woocommerce-checkout .bb-wc-co table.shop_table .bs-product-check {
    gap: 10px;
    flex-wrap: wrap;
}

.woocommerce .product-name .variation {
    margin-top: 0;
    flex-basis: 100%;
    font-style: oblique;
    color: #606060 !important;
}

.post .entry-content a,
.elementor-widget-text-editor a {
    color: #ef5455;
}

.post .entry-content a:hover,
.elementor-widget-text-editor a:hover {
    color: #009ffd;
}

/* Tutoring booking button icon (calendar) */
body #buddypress .member-header-actions > .generic-button > *.tutoring-booking i:before {
    content: "\e803";
    font-weight: 300;
}

body #buddypress .member-header-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

body #buddypress .member-header-actions+.bb_more_options {
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

@media screen and (max-width: 782px) {
    body #buddypress .member-header-actions-wrap {
        flex-direction: column;
    }

    body #buddypress .member-header-actions {
        align-items: center;
    }
}


/**
 * Product Vendor Info
 * Displays vendor avatar and name on single product page
 */
.product-vendor-info {
    margin-top: 10px;
    margin-bottom: 8px;
}

.product-vendor-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    text-decoration: none;
    transition: color 0.2s ease;
}

.product-vendor-link:hover {
    color: var(--bb-primary-color, #ef5455);
}

.product-vendor-avatar {
    border-radius: 50%;
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.product-vendor-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.elementor-widget-loop-carousel .swiper-pagination-bullets {
    --dots-horizontal-transform: 0;
}

/* Job Applications: round avatars to match BuddyBoss style */
.job-application header img {
    border-radius: 50%;
}

#job-manager-job-applications .job-applications ul.job-applications .job-application footer ul.actions li a {
    padding: 1em !important;
}

.bb-toast-messages-enable .bb-toast-messages {
    z-index: 99998;
}

/* WCFM vendors filter: widen the vendor select2 dropdown.
   Plugin pins it via min/max-width: 150px on a high-specificity selector,
   and select2 mirrors width: 150px inline from the source <select>.
   Override all three with !important. */
#wcfm-main-contentainer .wcfm_vendors_filter_wrap #dropdown_vendor + .select2-container {
    width: 320px !important;
    min-width: 320px !important;
    max-width: 320px !important;
}

/* WCFM date range picker: keep both months side-by-side.
   The bundled jquery.daterangepicker computes month-wrapper width
   assuming box-sizing: content-box (190 + 35 + 190 = 415), but the
   theme uses border-box, so padding+border eat ~12px and month2
   wraps below month1. Use min-width (not width) so the plugin's
   recalculation still runs but cannot collapse below the floor. */
.date-picker-wrapper .month-wrapper {
    min-width: 425px;
}

/* Profile-edit group tabs (Profile/Skills/Address/Payment/Vendor): nudge from
   the default 500 to 600 so the section tabs read as a bit more prominent.
   The second selector mirrors BuddyPress's own active-tab rule verbatim so it
   wins by source order (custom.css loads after buddypress.min.css) — otherwise
   the .current tab stays at the theme's 500. */
#profile-edit-form .button-tabs.button-nav a,
#buddypress .profile.edit .button-nav .current a {
    font-weight: 600;
}

/* Messages composer: make the error banner visible again.
   BuddyBoss JS prepends .compose-feedback to .bp-messages-content and renders
   every composer error into it (send failures plus client-side validation),
   but the parent theme pins it with position: absolute and no z-index. The
   compose form comes later in the DOM, is positioned too, and the message
   editor has an opaque background — so it paints straight over the banner and
   the error is silently invisible. Returning the container to normal flow puts
   the banner above the form instead of underneath it. */
.messages-screen .bp-messages-container .compose-feedback {
    position: static;
    top: auto;
    left: auto;
    right: auto;
}