/* BuddySocial v11.07 — compact 00's social-profile layout, Hyves-inspired but BuddySocial-owned */

body[data-page="profile"] .classic-profile{
  width:min(1180px,calc(100vw - 24px));
  margin:0 auto;
  font-family:Arial,Helvetica,sans-serif;
}

/* tighter top area */
body[data-page="profile"] .classic-profile .profile-namebar{
  min-height:38px;
  padding:7px 10px;
  border:1px solid #b9cedb;
  border-bottom:0;
  border-radius:3px 3px 0 0;
  background:linear-gradient(#ffffff,#edf5fa);
  box-shadow:inset 0 1px 0 #fff;
}
body[data-page="profile"] .classic-profile .profile-namebar h1{
  margin:0;
  font-size:20px;
  line-height:1.15;
  color:#1f668f;
}
body[data-page="profile"] .classic-profile .profile-namebar h1 span{
  font-size:12px;
  color:#7b8c98;
  font-weight:normal;
}
body[data-page="profile"] .classic-profile .profile-namebar a{
  font-size:11px;
  font-weight:bold;
}

body[data-page="profile"] .classic-profile .profile-cover-retro{
  min-height:92px;
  height:92px;
  border-left:1px solid #b9cedb;
  border-right:1px solid #b9cedb;
  border-bottom:1px solid #b9cedb;
  background-position:center 38%;
  box-shadow:inset 0 -18px 28px rgba(0,0,0,.08);
}

/* classic three-column proportions */
body[data-page="profile"] .classic-profile .profile-columns{
  display:grid!important;
  grid-template-columns:230px minmax(0,1fr) 276px!important;
  gap:9px!important;
  align-items:start;
  margin-top:9px;
}
body[data-page="profile"] .classic-profile .profile-left,
body[data-page="profile"] .classic-profile .profile-main,
body[data-page="profile"] .classic-profile .profile-right{
  min-width:0;
  width:auto;
}
body[data-page="profile"] .classic-profile .profile-left,
body[data-page="profile"] .classic-profile .profile-right{
  display:flex;
  flex-direction:column;
  gap:8px;
}
body[data-page="profile"] .classic-profile .profile-main{
  display:flex;
  flex-direction:column;
  gap:8px;
}

/* old-school box language: compact and squared */
body[data-page="profile"] .classic-profile .retro-box,
body[data-page="profile"] .classic-profile [data-pimp-block]{
  margin:0!important;
  border:1px solid #b8ccd8!important;
  border-radius:3px!important;
  box-shadow:0 1px 3px rgba(31,72,101,.10)!important;
  background:rgba(255,255,255,.96);
  overflow:hidden;
}
body[data-page="profile"] .classic-profile .retro-box.gap,
body[data-page="profile"] .classic-profile [data-pimp-block].gap{
  margin:0!important;
}
body[data-page="profile"] .classic-profile .retro-box-title,
body[data-page="profile"] .classic-profile [data-pimp-block]>.retro-box-title{
  min-height:27px!important;
  padding:5px 8px!important;
  border:0!important;
  border-bottom:1px solid #b9d2df!important;
  border-radius:0!important;
  background:linear-gradient(#eff9fd,#d6ebf4)!important;
  color:#176c98!important;
  font-size:12px!important;
  font-weight:bold!important;
  line-height:17px!important;
  text-shadow:0 1px 0 #fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
body[data-page="profile"] .classic-profile .retro-box-title a{
  color:#337da4!important;
  font-size:10px!important;
  font-weight:normal!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block]::before,
body[data-page="profile"] .classic-profile [data-pimp-block]>.retro-box-title::after{
  display:none!important;
}
body[data-page="profile"] .classic-profile .retro-pad,
body[data-page="profile"] .classic-profile [data-pimp-block]>.retro-pad{
  padding:8px!important;
}

/* orange activity accent on central social blocks */
body[data-page="profile"] .classic-profile [data-pimp-block="www"]>.retro-box-title,
body[data-page="profile"] .classic-profile [data-pimp-block="scrapcomposer"]>.retro-box-title,
body[data-page="profile"] .classic-profile [data-pimp-block="scraps"]>.retro-box-title,
body[data-page="profile"] .classic-profile [data-pimp-block="posts"]>.retro-box-title{
  background:linear-gradient(#fff7e9,#f8e3bd)!important;
  border-bottom-color:#e7c687!important;
  color:#986014!important;
}

/* profile card closer to old social-network proportions */
body[data-page="profile"] .classic-profile [data-pimp-block="profile"] .big-profile-avatar{
  width:178px!important;
  max-width:100%!important;
  height:auto!important;
  border-radius:2px!important;
  border:1px solid #b9cbd7!important;
  padding:3px;
  background:#fff;
  box-shadow:0 1px 4px rgba(24,60,84,.14)!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="profile"] .hyves-profilecard-meta-two{
  gap:5px!important;
  margin-top:7px!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="profile"] .hyves-profilecard-infoframe{
  border-radius:2px!important;
  padding:5px!important;
  font-size:10px!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="profile"] .profile-tagline,
body[data-page="profile"] .classic-profile [data-pimp-block="profile"] .quote{
  border-radius:2px!important;
  padding:6px!important;
  font-size:11px!important;
}
body[data-page="profile"] .classic-profile .profile-actionlist{
  margin-top:7px!important;
}
body[data-page="profile"] .classic-profile .profile-action-row,
body[data-page="profile"] .classic-profile .profile-action-row button{
  min-height:27px!important;
  font-size:11px!important;
}

/* centre column should feel like the main timeline */
body[data-page="profile"] .classic-profile .profile-main .retro-box{
  width:100%;
}
body[data-page="profile"] .classic-profile [data-pimp-block="bio"] .retro-pad{
  font-size:12px;
  line-height:1.45;
}
body[data-page="profile"] .classic-profile [data-pimp-block="scraps"] .scrap,
body[data-page="profile"] .classic-profile [data-pimp-block="scraps"] .scrap-item,
body[data-page="profile"] .classic-profile [data-pimp-block="scraps"] .hyves-scrap-item{
  border-radius:2px!important;
  margin:0 0 6px!important;
  box-shadow:none!important;
  border:1px solid #d6e1e7!important;
}

/* classic friends block */
body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .friend-grid,
body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .profile-friends-preview{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:5px!important;
  padding:7px!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .friend-grid>a,
body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .profile-friends-preview>a{
  min-width:0;
  padding:2px!important;
  border-radius:0!important;
  text-align:center;
  background:transparent!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .friend-avatar,
body[data-page="profile"] .classic-profile [data-pimp-block="friends"] img{
  width:58px!important;
  height:58px!important;
  max-width:100%!important;
  border-radius:1px!important;
  border:1px solid #b8cbd6!important;
  padding:2px;
  background:#fff;
  box-shadow:none!important;
  object-fit:cover;
}
body[data-page="profile"] .classic-profile [data-pimp-block="friends"] a span{
  display:block;
  margin-top:2px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#28739d;
  font-size:10px;
}
body[data-page="profile"] .classic-profile .box-more{
  display:block;
  padding:5px 7px!important;
  border-top:1px dotted #ccdbe3;
  color:#337ba2!important;
  font-size:10px!important;
  text-align:right;
}

/* compact right-column mini blocks */
body[data-page="profile"] .classic-profile [data-pimp-block="badges"] .retro-pad,
body[data-page="profile"] .classic-profile [data-pimp-block="gifts"] .retro-pad,
body[data-page="profile"] .classic-profile [data-pimp-block="agenda"] .retro-pad,
body[data-page="profile"] .classic-profile [data-pimp-block="gadgets"] .retro-pad{
  padding:7px!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="agenda"] .buddy-calendar-mini-item{
  border-radius:0!important;
  padding:5px 2px!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="agenda"] .buddy-calendar-mini-icon{
  width:23px!important;
  height:23px!important;
  border-radius:2px!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="gadgets"] .buddy-gadget,
body[data-page="profile"] .classic-profile [data-pimp-block="gadgets"] .gadget{
  border-radius:2px!important;
  box-shadow:0 1px 3px rgba(33,67,96,.08)!important;
}

/* virtual pet stays rich, but in an old-profile frame */
body[data-page="profile"] .classic-profile [data-pimp-block="pet"] .pet-scene{
  border-radius:3px!important;
  min-height:132px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 1px 3px rgba(32,68,92,.12)!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="pet"] .nostalgia-pet{
  gap:8px!important;
}
body[data-page="profile"] .classic-profile [data-pimp-block="pet"] .pet-action-row button{
  border-radius:2px!important;
}

/* small 00's-style separators */
body[data-page="profile"] .classic-profile .profile-left .retro-box + .retro-box,
body[data-page="profile"] .classic-profile .profile-main .retro-box + .retro-box,
body[data-page="profile"] .classic-profile .profile-right .retro-box + .retro-box{
  margin-top:0!important;
}

/* tablet: left + main, right drops below main */
@media(max-width:980px){
  body[data-page="profile"] .classic-profile{
    width:min(820px,calc(100vw - 18px));
  }
  body[data-page="profile"] .classic-profile .profile-columns{
    grid-template-columns:210px minmax(0,1fr)!important;
    gap:8px!important;
  }
  body[data-page="profile"] .classic-profile .profile-right{
    grid-column:2;
  }
}

/* mobile: classic blocks stacked, but not giant */
@media(max-width:700px){
  body[data-page="profile"] .classic-profile{
    width:100%;
    padding:0 6px;
    box-sizing:border-box;
  }
  body[data-page="profile"] .classic-profile .profile-namebar{
    border-radius:0;
    min-height:34px;
  }
  body[data-page="profile"] .classic-profile .profile-namebar h1{
    font-size:17px;
  }
  body[data-page="profile"] .classic-profile .profile-cover-retro{
    height:74px;
    min-height:74px;
  }
  body[data-page="profile"] .classic-profile .profile-columns{
    display:flex!important;
    flex-direction:column!important;
    gap:7px!important;
    margin-top:7px;
  }
  body[data-page="profile"] .classic-profile .profile-left,
  body[data-page="profile"] .classic-profile .profile-main,
  body[data-page="profile"] .classic-profile .profile-right{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    gap:7px!important;
  }
  body[data-page="profile"] .classic-profile .retro-box-title,
  body[data-page="profile"] .classic-profile [data-pimp-block]>.retro-box-title{
    min-height:29px!important;
    padding:6px 8px!important;
    font-size:12px!important;
  }
  body[data-page="profile"] .classic-profile [data-pimp-block="profile"] .big-profile-avatar{
    width:min(100%,320px)!important;
  }
  body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .friend-grid,
  body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .profile-friends-preview{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
  }
  body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .friend-avatar,
  body[data-page="profile"] .classic-profile [data-pimp-block="friends"] img{
    width:64px!important;
    height:64px!important;
  }
  body[data-page="profile"] .classic-profile [data-pimp-block="pet"] .pet-scene{
    min-height:126px!important;
  }
}

@media(max-width:390px){
  body[data-page="profile"] .classic-profile [data-pimp-block="friends"] .friend-avatar,
  body[data-page="profile"] .classic-profile [data-pimp-block="friends"] img{
    width:56px!important;
    height:56px!important;
  }
}
