/* ACTIVITY_SOCIAL_PROFILE_V1 */

.wn-activity-social-profile{
    width:min(760px, calc(100% - 32px));
    margin:0 auto;
    padding:34px 0 70px;
}

.wn-activity-social-back{
    margin-bottom:18px;
    text-align:right;
}

.wn-activity-social-back a{
    font-weight:800;
}

.wn-activity-social-head{
    display:flex;
    align-items:center;
    gap:22px;
    padding:24px;
    border:1px solid rgba(80,40,80,.10);
    border-radius:26px;
    background:rgba(255,255,255,.72);
}

.wn-activity-social-avatar{
    flex:0 0 94px;
    width:94px;
    height:94px;
    border-radius:50%;
    overflow:hidden;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.9);
    font-size:34px;
    font-weight:900;
}

.wn-activity-social-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.wn-activity-social-copy{
    flex:1;
    min-width:0;
}

.wn-activity-social-name-row{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.wn-activity-social-name-row h1{
    margin:0;
    font-size:25px;
}

.wn-activity-social-verified{
    font-size:11px;
    font-weight:800;
}

.wn-activity-social-location{
    margin-top:5px;
    opacity:.66;
    font-size:13px;
}

.wn-activity-social-stats{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:20px;
}

.wn-activity-social-stats a{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:2px;
    padding:8px;
    text-align:center;
}

.wn-activity-social-stats strong{
    font-size:17px;
}

.wn-activity-social-stats span{
    font-size:12px;
    opacity:.66;
}

.wn-activity-social-follow{
    margin-top:14px;
}

.wn-activity-social-follow form{
    margin:0;
}

.wn-activity-social-follow button,
.wn-activity-social-follow > a{
    min-width:118px;
    min-height:38px;
    padding:8px 18px;
    border-radius:14px;
    border:1px solid currentColor;
    background:transparent;
    color:inherit;
    font:inherit;
    font-weight:800;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.wn-activity-social-follow .is-following{
    opacity:.72;
}

.wn-activity-social-tabs{
    margin-top:22px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-top:1px solid rgba(80,40,80,.10);
    border-bottom:1px solid rgba(80,40,80,.10);
}

.wn-activity-social-tabs a{
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    font-weight:800;
    opacity:.64;
}

.wn-activity-social-tabs a.is-active{
    opacity:1;
}

.wn-activity-social-tabs a.is-active::after{
    content:"";
    position:absolute;
    inset-inline:18%;
    bottom:0;
    height:3px;
    border-radius:999px;
    background:currentColor;
}

.wn-activity-social-grid{
    width:min(520px,100%);
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:2px;
}

.wn-activity-social-media{
    margin:0;
    min-width:0;
    background:rgba(255,255,255,.56);
}

.wn-activity-social-media img,
.wn-activity-social-media video{
    display:block;
    width:100%;
    aspect-ratio:1/1;
    object-fit:cover;
    background:#000;
}

.wn-activity-social-media p{
    margin:0;
    padding:10px;
    font-size:12px;
}

.wn-activity-social-text{
    grid-column:1/-1;
    margin:8px 0;
    padding:18px;
    border-radius:18px;
    background:rgba(255,255,255,.72);
}

.wn-activity-social-text p{
    margin:0;
    line-height:1.8;
}

.wn-activity-social-empty{
    grid-column:1/-1;
    padding:42px 20px;
    text-align:center;
    opacity:.64;
}

.wn-activity-social-pagination{
    margin-top:24px;
}

@media (min-width:768px) and (max-width:1023px){
    .wn-activity-social-profile{
        width:min(720px, calc(100% - 28px));
    }
}

@media (max-width:767px){
    .wn-activity-social-profile{
        width:calc(100% - 20px);
        padding-top:20px;
    }

    .wn-activity-social-head{
        gap:14px;
        padding:18px 14px;
        border-radius:22px;
    }

    .wn-activity-social-avatar{
        flex-basis:76px;
        width:76px;
        height:76px;
    }

    .wn-activity-social-name-row h1{
        font-size:21px;
    }

    .wn-activity-social-tabs a{
        min-height:48px;
        font-size:13px;
    }

    .wn-activity-social-grid{
        width:100%;
    }
}


/* ACTIVITY_PROFILE_USER_PARITY_V2 */

/* Same content width as approved public profile */
.wn-activity-social-profile{
    width:min(
        var(--wn-layout-content-max, 820px),
        calc(100% - 48px)
    );
    margin:24px auto 56px;
    padding:0;
}

.wn-activity-social-back{
    margin:0 0 18px;
    text-align:right;
}

.wn-activity-social-back a{
    color:var(--wn-color-brand-deep, #35103e);
    font-size:14px;
    font-weight:800;
    text-decoration:none;
}

/* Exact public-profile header geometry */
.wn-activity-social-head{
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
}

.wn-profile-header{
    display:grid;
    grid-template-columns:90px minmax(0,1fr);
    gap:12px 18px;
    align-items:center;
}

.wn-profile-avatar{
    width:88px;
    height:88px;
    border-radius:50%;
    overflow:hidden;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid var(
        --wn-color-info-border,
        #eadfeb
    );

    background:var(
        --wn-color-connections-avatar-bg,
        #f3e8f3
    );

    color:var(
        --wn-color-brand-deep,
        #35103e
    );

    font-size:30px;
    font-weight:900;
}

.wn-profile-avatar img{
    width:100%;
    height:100%;
    border-radius:50%;
    object-fit:cover;
}

.wn-profile-main{
    min-width:0;
}

.wn-activity-social-name-row{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.wn-profile-name{
    margin:0;
    color:var(
        --wn-color-connections-title,
        #35103e
    );
    font-size:22px;
    line-height:1.25;
    font-weight:800;
}

.wn-activity-social-verified{
    font-size:11px;
    font-weight:800;
}

.wn-profile-username{
    margin-top:var(--wn-space-2xs, 4px);
    color:var(
        --wn-color-public-profile-hex-775f7c,
        #775f7c
    );
    font-size:14px;
}

.wn-activity-social-location{
    direction:rtl;
    text-align:right;
}

/* Same statistics row as user profile */
.wn-profile-stats{
    margin-top:22px;

    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
}

.wn-profile-stat{
    position:relative;

    padding:4px 8px;

    display:flex;
    flex-direction:column;
    align-items:center;
    gap:2px;

    text-align:center;
    text-decoration:none;

    color:var(
        --wn-color-public-profile-hex-7c6a82,
        #7c6a82
    );

    font-size:12px;
    line-height:1.2;
}

.wn-profile-stat + .wn-profile-stat::before{
    content:"";

    position:absolute;
    inset-inline-start:0;
    top:5px;
    bottom:5px;

    width:1px;

    background:var(
        --wn-color-connections-tab-line,
        #e8deeb
    );
}

.wn-profile-stat strong{
    margin-bottom:var(--wn-space-2xs, 4px);

    color:var(
        --wn-color-connections-title,
        #35103e
    );

    font-size:18px;
    line-height:1;
    font-weight:800;
}

/* Same details / WN ID position */
.wn-profile-details{
    margin-top:var(--wn-space-md, 10px);
}

.wn-profile-id{
    width:100%;
    min-height:48px;
    margin-top:var(--wn-space-xl, 14px);
    padding:0;

    display:grid;
    align-items:stretch;

    border:1px solid var(
        --wn-color-public-profile-hex-f0cce4,
        #f0cce4
    );

    border-radius:var(--wn-radius-ui, 14px);
    overflow:hidden;

    background:var(
        --wn-color-v4-fff2f8,
        #fff2f8
    );

    color:var(
        --wn-color-connections-title,
        #35103e
    );

    font-size:15px;
    font-weight:900;
}

/* Visitor = ID uses full approved bar */
.wn-profile-id.is-activity-id-only{
    grid-template-columns:1fr;
}

/* Owner currently has one activity inbox tool */
.wn-profile-id.has-activity-tools{
    grid-template-columns:minmax(0,1fr) 72px;
}

.wn-profile-id-value,
.wn-profile-id-tool{
    min-height:48px;

    display:flex;
    align-items:center;
    justify-content:center;
}

.wn-profile-id-value{
    padding:0 10px;
    direction:ltr;
    white-space:nowrap;
}

.wn-profile-id-tools{
    display:contents;
}

.wn-profile-id-tool{
    padding:0;

    border:0;
    border-inline-start:1px solid var(
        --wn-color-public-profile-hex-efd7e7,
        #efd7e7
    );

    border-radius:0;

    background:transparent;

    color:var(
        --wn-color-public-profile-hex-552061,
        #552061
    );

    text-decoration:none;
    cursor:pointer;
}

.wn-profile-id-tool:hover{
    background:var(
        --wn-color-public-profile-hex-f7eaf4,
        #f7eaf4
    );
}

.wn-profile-id-tool svg{
    width:17px;
    height:17px;

    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

/* Same visitor action family */
.wn-visitor-actions{
    margin-top:24px;

    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--wn-space-md, 10px);
}

.wn-visitor-actions form{
    width:100%;
    margin:0;
}

.wn-visitor-actions .profile-follow-btn,
.wn-visitor-actions .wn-visitor-btn{
    width:100%;
    min-height:42px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:0;
    border-radius:10px;

    background:var(
        --wn-color-public-profile-hex-eceff2,
        #eceff2
    );

    color:var(
        --wn-color-public-profile-hex-171217,
        #171217
    );

    text-decoration:none;

    font:inherit;
    font-size:14px;
    font-weight:800;

    cursor:pointer;
}

/* Existing activity tabs/content stay functional */
.wn-activity-social-tabs{
    margin-top:28px;

    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));

    border-top:1px solid rgba(80,40,80,.10);
    border-bottom:1px solid rgba(80,40,80,.10);
}

.wn-activity-social-tabs a{
    min-height:52px;

    display:flex;
    align-items:center;
    justify-content:center;

    position:relative;

    color:inherit;
    text-decoration:none;

    font-weight:800;
    opacity:.64;
}

.wn-activity-social-tabs a.is-active{
    opacity:1;
}

.wn-activity-social-tabs a.is-active::after{
    content:"";

    position:absolute;
    inset-inline:18%;
    bottom:0;

    height:3px;
    border-radius:999px;

    background:currentColor;
}

.wn-activity-social-grid{
    width:min(520px,100%);
    margin:0 auto;

    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:2px;
}

/* iPad / Tablet — same approved user profile scale */
@media (min-width:768px) and (max-width:1023px){

    .wn-activity-social-profile{
        width:min(
            var(--wn-layout-content-tablet-max, 760px),
            calc(100% - 40px)
        );
        margin:20px auto 48px;
    }

    .wn-profile-header{
        grid-template-columns:112px minmax(0,1fr);
        gap:18px 24px;
    }

    .wn-profile-avatar{
        width:108px;
        height:108px;
        font-size:36px;
    }

    .wn-profile-name{
        font-size:24px;
    }

    .wn-profile-username{
        font-size:14px;
    }

    .wn-profile-stat{
        padding:6px 10px;
    }
}

/* Mobile — same approved user profile scale */
@media (max-width:767px){

    .wn-activity-social-profile{
        width:calc(100% - 20px);
        margin:12px auto 36px;
    }

    .wn-profile-header{
        grid-template-columns:78px minmax(0,1fr);
        gap:10px 12px;
    }

    .wn-profile-avatar{
        width:76px;
        height:76px;
        font-size:27px;
    }

    .wn-profile-name{
        font-size:19px;
        line-height:1.3;
    }

    .wn-profile-username{
        font-size:12px;
    }

    .wn-profile-stat{
        min-width:0;
        padding:5px 4px;
        font-size:11px;
    }

    .wn-profile-stat strong{
        font-size:17px;
    }

    .wn-profile-details{
        margin-top:var(--wn-space-sm, 8px);
    }

    .wn-profile-id{
        font-size:12px;
    }

    .wn-profile-id-value{
        padding:0 7px;
    }

    .wn-visitor-actions{
        gap:var(--wn-space-sm, 8px);
    }

    .wn-activity-social-tabs a{
        min-height:48px;
        font-size:13px;
    }

    .wn-activity-social-grid{
        width:100%;
    }
}

/* Small phones */
@media (max-width:479px){

    .wn-profile-header{
        grid-template-columns:70px minmax(0,1fr);
        gap:9px 10px;
    }

    .wn-profile-avatar{
        width:68px;
        height:68px;
        font-size:24px;
    }

    .wn-profile-name{
        font-size:18px;
    }
}

/* ACTIVITY_PROFILE_STACK_FIX_V1 */
.wn-activity-social-head{
    display:block;
}