/* ==========================================================
   CENCRAFT BUDDYPRESS PROFILE
========================================================== */


/* ==========================================================
   REMOVE DEFAULT BUDDYPRESS COVER
========================================================== */

#buddypress #header-cover-image,
#buddypress a[href*="change-avatar"],
#buddypress a[href*="change-cover-image"] {

    display:none !important;

}


/* ==========================================================
   CLEAN MEMBER HEADER
========================================================== */

#buddypress #item-header {

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:none !important;

    min-height:0 !important;

}


/* Remove default BP floats */

#buddypress #item-header-avatar,
#buddypress #item-header-content {

    float:none !important;

    width:auto !important;

    margin:0 !important;

}



/* ==========================================================
   MAIN PROFILE CARD
========================================================== */

#buddypress .cc-bp-profile-header {

    display:flex;

    align-items:center;

    gap:80px;

    width:100%;

    padding:45px 55px;

    box-sizing:border-box;

    background:
    rgba(15,23,42,.75);

    border:

    1px solid rgba(255,255,255,.08);

    border-radius:20px;

}



/* ==========================================================
   PLAYER MODEL
========================================================== */

#buddypress .cc-bp-player {

    flex:0 0 330px;

    display:flex;

    align-items:center;

    justify-content:center;

}



#buddypress .cc-bp-player img {

    height:520px !important;

    width:auto !important;

    display:block;

    object-fit:contain;

    filter:
    drop-shadow(
        0 0 30px rgba(34,211,238,.25)
    );

}



/* ==========================================================
   PROFILE INFO
========================================================== */

#buddypress .cc-bp-profile-info {

    flex:1;

    min-width:0;

}



/* Username */

.cc-bp-name {
    display:flex;
    align-items:center;
    gap:12px;

    margin:0;

    font-size:32px !important;
    line-height:1.15;

    font-weight:700;
}



/*  verified badge */

.cc-bp-name .bp-verified-badge {
    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:24px;
    height:24px;

    flex-shrink:0;

    transform:translateY(2px);
}



/* Activity */

.cc-bp-status {

    margin-top:12px;

    color:#94a3b8;

    font-size:16px;

}



/* ==========================================================
   IDENTITY CARD
========================================================== */


#buddypress .cc-bp-identity-card {

    width:100%;

    max-width:760px;

    margin-top:35px;

    padding:35px;

    box-sizing:border-box;

    background:

    rgba(15,23,42,.75);


    border:

    1px solid rgba(255,255,255,.08);


    border-radius:18px;

}



#buddypress .cc-bp-identity-card h3 {

    margin:0 0 25px;

    color:#f8fafc;

    font-size:22px;

    font-weight:600;

}



/* Rows */

#buddypress .cc-bp-row {

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

    padding:16px 0;

    border-bottom:

    1px solid rgba(255,255,255,.08);

}



#buddypress .cc-bp-row span {

    color:#94a3b8;

}



#buddypress .cc-bp-row strong {

    color:#f8fafc;

    font-weight:600;

    text-align:right;

    overflow-wrap:anywhere;

}



/* Managed */

#buddypress .cc-bp-managed {

    margin-top:20px;

    color:#22d3ee;

    font-size:15px;

    font-weight:500;

}



/* ==========================================================
   HIDE DEFAULT BP CONTENT
========================================================== */


#buddypress .bp-navs,
#buddypress .bp-subnavs {

    display:none !important;

}


#buddypress #item-body {

    display:none !important;

}


/* Hide page title */

body.bp-user .entry-title,
body.bp-user .page-title,
body.bp-user .post-title,
body.bp-user .entry-header {

    display:none !important;

}


body.bp-user .site-content {

    padding-top:0 !important;

}



/* ==========================================================
   MOBILE
========================================================== */


@media(max-width:800px){


#buddypress .cc-bp-profile-header {

    flex-direction:column;

    padding:30px 20px;

    gap:35px;

}


#buddypress .cc-bp-player {

    flex:none;

}


#buddypress .cc-bp-player img {

    height:360px !important;

}


#buddypress .cc-bp-row {

    flex-direction:column;

    align-items:flex-start;

}


#buddypress .cc-bp-row strong {

    text-align:left;

}

/* ==========================================================
   FINAL PROFILE ADJUSTMENTS
========================================================== */


/* Make the right side wider */
#buddypress .cc-bp-profile-info {

    flex: 1;

    max-width:900px;

}


/* Bigger account card */
#buddypress .cc-bp-identity-card {

    max-width:850px;

    padding:35px 40px;

}


/* Fix row sizing */
#buddypress .cc-bp-row {

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:50px;

}


/* Left labels */
#buddypress .cc-bp-row span {

    color:#94a3b8;

    font-size:18px;

    font-weight:500;

}


/* Right values */
#buddypress .cc-bp-row strong {

    color:#f8fafc;

    font-size:22px;

    font-weight:700;

    max-width:600px;

    text-align:right;

    white-space:normal;

    overflow-wrap:anywhere;

}


/* UUID specifically */
#buddypress .cc-bp-row strong {

    letter-spacing:.2px;

}


/* Managed text */
#buddypress .cc-bp-managed {

    font-size:16px;

}


/* Slightly move player back up */
#buddypress .cc-bp-player img {

    height:560px !important;

}



/* Username above activity */
.cc-bp-name {
    display:flex;
    align-items:center;
    gap:14px;
}


.cc-bp-status {

    font-size:17px;

}


/* ==========================================================
   CENCRAFT MEMBERS DIRECTORY
   ========================================================== */

.cc-members-directory {
    width: 100%;
}


/* ==========================================================
   HERO
   ========================================================== */

.cc-members-hero {
    position: relative;

    width: 100%;

    padding: 72px 0 52px;

    overflow: hidden;

    border-bottom: 1px solid rgba(18, 217, 239, 0.08);
}


/* subtle background glow */

.cc-members-hero::before {
    content: "";

    position: absolute;

    top: -180px;
    left: 15%;

    width: 600px;
    height: 400px;

    pointer-events: none;

    background:
        radial-gradient(
            circle,
            rgba(18, 217, 239, 0.07) 0%,
            rgba(18, 217, 239, 0.02) 40%,
            transparent 70%
        );
}


.cc-members-hero-inner {
    position: relative;

    width: min(1320px, calc(100% - 48px));

    margin: 0 auto;
}


/* ==========================================================
   EYEBROW
   ========================================================== */

.cc-members-eyebrow {
    margin-bottom: 14px;

    color: #12d9ef;

    font-size: 11px;
    font-weight: 700;

    line-height: 1;

    letter-spacing: 0.18em;

    text-transform: uppercase;
}


/* ==========================================================
   TITLE
   ========================================================== */

.cc-members-title {
    margin: 0 !important;

    color: #f2f7fa;

    font-size: clamp(38px, 5vw, 64px) !important;
    font-weight: 800 !important;

    line-height: 1.05 !important;

    letter-spacing: -0.035em;
}

.cc-members-title span {
    color: #12d9ef;
}


/* ==========================================================
   DESCRIPTION
   ========================================================== */

.cc-members-description {
    max-width: 620px;

    margin: 18px 0 0 !important;

    color: #8494a7;

    font-size: 15px;
    font-weight: 400;

    line-height: 1.7;
}


/* ==========================================================
   DIRECTORY CONTAINER
   ========================================================== */

.cc-members-container {
    width: min(1320px, calc(100% - 48px));

    margin: 0 auto;

    padding: 38px 0 100px;
}


/* ==========================================================
   BUDDYPRESS DIRECTORY NAV
   ========================================================== */

.cc-members-nav {
    margin-bottom: 24px;
}


/* ==========================================================
   TOOLBAR
   ========================================================== */

.cc-members-toolbar {
    position: relative;

    margin-bottom: 28px;
    padding: 18px;

    background:
        linear-gradient(
            145deg,
            rgba(10, 28, 46, 0.85),
            rgba(7, 20, 35, 0.85)
        );

    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 6px;
}


/* remove random BuddyPress toolbar margins */

.cc-members-toolbar .bp-navs,
.cc-members-toolbar .subnav-filters,
.cc-members-toolbar .dir-search {
    margin-top: 0;
    margin-bottom: 0;
}


/* ==========================================================
   SEARCH INPUT
   ========================================================== */

.cc-members-toolbar input[type="search"],
.cc-members-toolbar input[type="text"] {
    min-height: 46px;

    padding: 0 16px !important;

    color: #e9f3f8 !important;
    background: #071522 !important;

    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-radius: 4px !important;

    outline: none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.cc-members-toolbar input[type="search"]:focus,
.cc-members-toolbar input[type="text"]:focus {
    border-color: rgba(18, 217, 239, 0.55) !important;

    box-shadow:
        0 0 0 3px rgba(18, 217, 239, 0.06);
}

.cc-members-toolbar input::placeholder {
    color: #68798b;
}


/* ==========================================================
   SELECT
   ========================================================== */

.cc-members-toolbar select {
    min-height: 46px;

    padding: 0 42px 0 15px !important;

    color: #dce8ee !important;
    background-color: #071522 !important;

    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-radius: 4px !important;

    font-size: 12px;
    font-weight: 600;

    outline: none;
}

.cc-members-toolbar select:focus {
    border-color: rgba(18, 217, 239, 0.55) !important;
}


/* ==========================================================
   AJAX RESULTS
   ========================================================== */

.cc-members-results {
    min-height: 200px;
}


/* ==========================================================
   LOADING
   ========================================================== */

.cc-members-results #bp-ajax-loader {
    padding: 60px 0;

    color: #718195;

    text-align: center;
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 700px) {

    .cc-members-hero {
        padding:
            50px 0
            38px;
    }

    .cc-members-hero-inner,
    .cc-members-container {
        width: calc(100% - 36px);
    }

    .cc-members-container {
        padding:
            28px 0
            70px;
    }

    .cc-members-toolbar {
        padding: 14px;
    }

}