/*====================================================
    MEMBER CARD
====================================================*/

.member-card{
    background:#f1f1f1;
    border-radius:18px;
    padding:18px 22px;
    margin-bottom:14px;
    border:1px solid #ececec;
    box-shadow:0 5px 18px rgba(0,0,0,.06);
    transition:.25s;
    width:100%;
    max-width:100%;
    overflow:hidden;
}

.member-card > .row > [class*="col-"]{
    min-width:0;
}

.member-card:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 30px rgba(0,0,0,.12);
}

/*====================================================
    PROFILE IMAGE
====================================================*/

.member-photo-img{
    width:90px;
    height:90px;
    object-fit:cover;
    border-radius:50%;
    border:3px solid #ffc94d;
    padding:2px;
    box-shadow:0 3px 10px rgba(0,0,0,.08);
    transition:.3s;
}

.member-photo-img:hover{
    transform:scale(1.04);
}

/*====================================================
    NAME
====================================================*/

.member-name{
    font-size:22px;
    font-weight:700;
    margin-bottom:3px;
}

.member-name a{
    color:#222;
    text-decoration:none;
    overflow-wrap:anywhere;
}

.member-name a:hover{
    color:#7a35ff;
}

/*====================================================
    MEMBER ID
====================================================*/

.member-id{
    color:#8a3ffc;
    font-size:14px;
    font-weight:600;
    margin-bottom:4px;
}

.member-id span{
    color:#ff4d94;
    font-weight:700;
}

/*====================================================
    LOCATION
====================================================*/

.member-location{
    color:#333;
    font-size:15px;
    font-weight:600;
    margin-bottom:8px;
}

.member-location i{
    color:#222;
    margin-right:8px;
}

/*====================================================
    DETAILS
====================================================*/

.info-item{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    font-weight:600;
    color:#222;
    padding:4px 0;
}

.info-item i{
    width:22px;
    text-align:center;
    color:#222;
    font-size:17px;
}

.info-item strong{
    color:#222;
}

/*====================================================
    BADGES
====================================================*/

.verified-badge-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:#2b7cff;
    color:#fff;
    font-size:13px;
    font-weight:600;
    padding:8px 16px;
    border-radius:50px;
}

.premium-badge-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:#ffc107;
    color:#222;
    font-size:13px;
    font-weight:600;
    padding:6px 14px;
    border-radius:50px;
}

/*====================================================
    ACTION BAR
====================================================*/

.member-action-bar{
    padding:2px 0;
}

.action-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:#222;
    font-size:16px;
    font-weight:500;
    text-decoration:none;
    transition:.25s;
}

.action-btn:hover{
    color:#0d6efd;
}

.action-btn i{
    font-size:20px;
}

.action-btn i.fa-heart{
    color:#ff4d5e;
}

.action-btn i.fa-user-times{
    color:#ff4d5e;
}

.action-btn i.fa-star{
    color:#ffc107;
}

.action-btn.text-danger i{
    color:#ff4d5e;
}

/*====================================================
    MORE DETAILS
====================================================*/

.more-details{
    text-decoration:none;
    font-weight:700;
    color:#8a3ffc;
    font-size:15px;
}

.more-details:hover{
    color:#5c1fd6;
}

/*====================================================
    FOOTER
====================================================*/

.text-muted{
    font-size:14px;
}

.text-muted i{
    margin-right:6px;
}

/*====================================================
    HORIZONTAL LINE
====================================================*/

.member-card hr{
    margin:8px 0;
    border-color:#efefef;
}

/*====================================================
    SRI LANKA FLAG
====================================================*/

.country-flag{
    width:34px;
    border-radius:4px;
    box-shadow:0 2px 5px rgba(0,0,0,.12);
}

/*====================================================
    RESPONSIVE
====================================================*/

@media(max-width:991px){

.member-name{
    font-size:22px;
    text-align:center;
}

.member-id{
    text-align:center;
}

.member-location{
    text-align:center;
    justify-content:center;
}

.info-item{
    justify-content:center;
}

.col-lg-2.col-md-2.text-end{
    text-align:center!important;
    margin-top:16px;
}

}

@media(max-width:767px){

.member-card{
    padding:20px;
}

.member-photo-img{
    width:90px;
    height:90px;
}

.member-name{
    font-size:20px;
}

.info-item{
    font-size:14px;
}

.action-btn{
    font-size:14px;
}

.action-btn i{
    font-size:18px;
}

.member-card__footer{
    flex-direction:column;
    gap:10px;
    align-items:flex-start!important;
}

.member-action-bar{
    flex-wrap:nowrap;
}

.member-action-bar > .col{
    min-width:0;
    padding-right:3px;
    padding-left:3px;
}

.action-btn{
    width:100%;
    min-height:44px;
    flex-direction:column;
    gap:3px;
    font-size:12px;
    line-height:1.15;
    white-space:nowrap;
}

}

@media(max-width:480px){

.member-photo-img{
    width:80px;
    height:80px;
}

.member-name{
    font-size:18px;
}

.member-card{
    padding:15px;
}

.info-item{
    justify-content:flex-start;
}

}


/*====================================================
    PROFILE CARD (SIDEBAR)
====================================================*/

.profile-card{
    background:#fff;
    border-radius:18px;
    box-shadow:0 8px 24px rgba(0,0,0,.06);
    overflow:hidden;
}

.profile-card__photo-wrap{
    text-align:center;
    padding:28px 0 8px;
    background:linear-gradient(180deg,#fbf3ff 0%,#ffffff 100%);
}

.profile-card__photo{
    width:130px;
    height:130px;
    object-fit:cover;
    border-radius:50%;
    border:4px solid #ffc94d;
    padding:3px;
    background:#fff;
    box-shadow:0 6px 16px rgba(0,0,0,.12);
}

/*====================================================
    NAME / ID
====================================================*/

.team-card__body-name{
    font-size:20px;
    font-weight:700;
    color:#222;
}

.team-card__body-id{
    font-size:13px;
    font-weight:600;
    color:#8a3ffc;
}

/*====================================================
    INTEREST BUTTON
====================================================*/

.profile-interest-love,
.vibrate-invite{
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:linear-gradient(135deg,#ff5da2,#8a3ffc);
    color:#fff !important;
    font-weight:600;
    font-size:13px;
    padding:9px 16px;
    border-radius:50px;
    text-decoration:none;
    box-shadow:0 6px 14px rgba(138,63,252,.28);
    transition:.25s;
}

.profile-interest-love:hover,
.vibrate-invite:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 20px rgba(138,63,252,.35);
    color:#fff;
}

.profile-interest-love.heart-color{
    background:#f1f1f1;
    color:#8a3ffc !important;
    box-shadow:none;
}

/*====================================================
    DETAIL ROWS (Marital Status / Looking For / Country)
====================================================*/

.search__right-details{
    margin-top:12px;
    border-top:1px solid #f0f0f0;
    padding-top:12px;
}

.profile-banner__left-detiails{
    align-items:center;
    padding:9px 0;
}

.profile-banner__left-detiails label{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:14px;
    font-weight:600;
    color:#444;
    margin:0;
}

.profile-banner__left-detiails > span{
    font-size:14px;
    font-weight:600;
    color:#888;
    text-align:right;
}

.detail-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    border-radius:50%;
    font-size:14px;
    flex-shrink:0;
}

.detail-icon--pink{ background:#ffe4ef; color:#ff4d94; }
.detail-icon--purple{ background:#f1e6ff; color:#8a3ffc; }
.detail-icon--blue{ background:#e4f0ff; color:#2b7cff; }
.detail-icon--green{ background:#e3fbef; color:#12b76a; }
.detail-icon--orange{ background:#fff2df; color:#ff9a3d; }

/*====================================================
    ACTION ICONS (Shortlist / Ignore / Report)
====================================================*/

.search__right-expression{
    border-top:1px solid #f0f0f0;
    margin-top:8px;
    padding-top:14px;
}

.profile-action{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    text-decoration:none;
    color:#555;
    font-size:13px;
    font-weight:600;
    transition:.2s;
}

.profile-action:hover{
    color:#8a3ffc;
    transform:translateY(-2px);
}

.profile-action__icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border-radius:50%;
    background:#fff6e0;
    color:#ffb020;
    font-size:17px;
    box-shadow:0 3px 8px rgba(0,0,0,.06);
}

.profile-action__icon--danger{
    background:#ffe7e7;
    color:#ff4d5e;
}

.profile-action__icon--info{
    background:#e4f0ff;
    color:#2b7cff;
}

.profile-action--active-star .profile-action__icon{
    background:#ffb020;
    color:#fff;
}

/*====================================================
    NAV TABS
====================================================*/

.custom--tabs{
    background:#fff;
    border-radius:14px;
    box-shadow:0 4px 14px rgba(0,0,0,.05);
    padding:6px;
    gap:4px;
}

.custom--tabs .nav-link{
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:600;
    font-size:15px;
    color:#666;
    border-radius:10px;
    padding:12px 20px;
    border:none;
    transition:.2s;
}

.custom--tabs .nav-link i{
    font-size:16px;
}

.custom--tabs .nav-link.active{
    background:linear-gradient(135deg,#fbeaff,#f3e8ff);
    color:#8a3ffc;
}

.custom--tabs .nav-link:not(.active):hover{
    background:#f7f7f7;
}

/*====================================================
    ACCORDION
====================================================*/

.custom--accordion .accordion-item{
    border:none;
    border-radius:14px !important;
    overflow:hidden;
    margin-bottom:16px;
    box-shadow:0 4px 14px rgba(0,0,0,.05);
}

.custom--accordion .accordion-button{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:16px;
    font-weight:700;
    color:#222;
    background:#fff;
    padding:18px 20px;
    box-shadow:none !important;
}

.custom--accordion .accordion-button:not(.collapsed){
    background:#faf5ff;
    color:#8a3ffc;
}

.custom--accordion .accordion-button::after{
    background-size:1.1rem;
    margin-left:auto;
}

.accordion-icon{
    color:#8a3ffc;
    font-size:16px;
    width:20px;
    text-align:center;
}

.custom--accordion .accordion-body{
    padding:20px;
    background:#fff;
}

/*====================================================
    CONTACT DETAILS TOGGLE
====================================================*/

.contact-detail-toggle{
    display:inline-flex;
    align-items:center;
    gap:6px;
    border-radius:10px;
    font-weight:700;
    padding:14px 20px;
    width:30%;
    text-align:left;
    background:#fff;
    border:1px solid #ffd7d7;
    color:#ff4d5e;
}

.contact-detail-toggle:hover{
    background:#fff5f5;
    color:#ff4d5e;
}

.contact-line{
    padding:8px 0;
    gap:2px;
}

.contact-line span:not(.detail-icon){
    font-size:14px;
    font-weight:600;
    color:#333;
}

/*====================================================
    EDUCATION / CAREER ITEMS
====================================================*/

.information-item{
    padding:14px 16px;
    border-radius:12px;
    background:#faf9fb;
    margin-bottom:12px;
    border-left:3px solid #8a3ffc;
}

.information-item__title{
    font-weight:700;
    color:#222;
}

.information-item__desc{
    color:#666;
    font-size:14px;
}

/*====================================================
    EMPTY STATE
====================================================*/

.empty-table{
    padding:50px 20px;
}

.empty-table__icon i{
    font-size:52px;
    color:#e2d6ff;
}

.empty-table__text{
    color:#888;
    font-weight:700;
    margin-top:10px;
}

/*====================================================
    GALLERY
====================================================*/

.profile-gallery{
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 4px 14px rgba(0,0,0,.08);
}

.profile-gallery__thumb{
    position:relative;
    overflow:hidden;
}

.profile-gallery__thumb img{
    width:100%;
    height:220px;
    object-fit:cover;
    transition:.3s;
}

.profile-gallery:hover .profile-gallery__thumb img{
    transform:scale(1.08);
}

.profile-gallery__icon{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(138,63,252,.35);
    opacity:0;
    transition:.25s;
}

.profile-gallery:hover .profile-gallery__icon{
    opacity:1;
}

.profile-gallery__icon a{
    color:#fff;
    font-size:22px;
}

/*====================================================
    RESPONSIVE
====================================================*/

@media(max-width:767px){

.profile-card__photo{
    width:100px;
    height:100px;
}

.team-card__body-name{
    font-size:18px;
}

.custom--tabs .nav-link{
    font-size:13px;
    padding:10px 14px;
}

.custom--tabs .nav-link span{
    display:none;
}

}

@media(max-width:374px){

.member-card{
    padding:12px 10px;
}

.member-action-bar > .col{
    padding-right:1px;
    padding-left:1px;
}

.action-btn{
    font-size:11px;
}

}