/* ==========================================================
   BuddySocial v9.91
   FULL WIDTH CLASSIC PIMP LAYOUT
   Keeps the v9.90 classic social-network look,
   but uses the full desktop viewport.
   ========================================================== */

/* Full-screen page canvas */
html,
body[data-page="pimp_profile"],
body[data-page="admin_pimp_profile"]{
  min-height:100% !important;
}

body[data-page="pimp_profile"],
body[data-page="admin_pimp_profile"]{
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  background:
    linear-gradient(rgba(235,244,250,.78),rgba(235,244,250,.78)),
    var(--site-bg-image,url("../images/buddysocial-fixed-pages-bg-v965.png")) center top / cover fixed !important;
}

/* Pimp now fills the available viewport width */
body[data-page="pimp_profile"] main.pimp-page,
body[data-page="admin_pimp_profile"] main.pimp-page{
  width:calc(100% - 20px) !important;
  max-width:none !important;
  margin:10px 10px 24px !important;
  box-sizing:border-box !important;
}

/* Full-width 3-column classic arrangement */
body[data-page="pimp_profile"] main.pimp-page.pimp-layout-v987,
body[data-page="admin_pimp_profile"] main.pimp-page.pimp-layout-v987{
  display:grid !important;
  grid-template-columns:190px minmax(0,1fr) 220px !important;
  gap:8px !important;
  align-items:start !important;
}

/* Hero/header spans the full available width */
body[data-page="pimp_profile"] .pimp-hero,
body[data-page="admin_pimp_profile"] .pimp-hero{
  grid-column:1 / -1 !important;
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
}

/* Center becomes the real wide working area */
body[data-page="pimp_profile"] .pimp-site-center,
body[data-page="admin_pimp_profile"] .pimp-site-center{
  grid-column:2 !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  justify-self:stretch !important;
}

/* Ensure all center sections stretch with the center column */
body[data-page="pimp_profile"] .pimp-site-center > *,
body[data-page="admin_pimp_profile"] .pimp-site-center > *{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
}

/* Dashboard uses available width more effectively */
body[data-page="pimp_profile"] .pimp-dashboard,
body[data-page="admin_pimp_profile"] .pimp-dashboard{
  width:100% !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:7px !important;
}

body[data-page="pimp_profile"] .pimp-dashboard > a,
body[data-page="admin_pimp_profile"] .pimp-dashboard > a{
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

/* Left/right columns keep classic narrow proportions */
body[data-page="pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav,
body[data-page="admin_pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav{
  width:190px !important;
  max-width:190px !important;
}

body[data-page="pimp_profile"] .pimp-site-rightbar,
body[data-page="admin_pimp_profile"] .pimp-site-rightbar{
  width:220px !important;
  max-width:220px !important;
}

/* Forms should take advantage of the wider center */
body[data-page="pimp_profile"] :is(
  .color-settings,
  .skin-layout,
  .theme-setting-grid,
  .block-text-controls,
  .titlebar-controls,
  .profile-layout-sliders,
  .profile-gloss-settings
),
body[data-page="admin_pimp_profile"] :is(
  .color-settings,
  .skin-layout,
  .theme-setting-grid,
  .block-text-controls,
  .titlebar-controls,
  .profile-layout-sliders,
  .profile-gloss-settings
){
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
}

/* More useful wide-grid controls on desktop */
@media(min-width:1200px){
  body[data-page="pimp_profile"] :is(.color-settings,.skin-layout,.theme-setting-grid,.block-text-controls),
  body[data-page="admin_pimp_profile"] :is(.color-settings,.skin-layout,.theme-setting-grid,.block-text-controls){
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px 10px !important;
  }

  body[data-page="pimp_profile"] .pimp-style-preset-grid,
  body[data-page="admin_pimp_profile"] .pimp-style-preset-grid{
    grid-template-columns:repeat(4,minmax(120px,1fr)) !important;
  }
}

/* Keep cards from becoming ridiculously tall due to extra width */
body[data-page="pimp_profile"] .pimp-setting-card,
body[data-page="admin_pimp_profile"] .pimp-setting-card,
body[data-page="pimp_profile"] fieldset.theme-field.block-text-studio,
body[data-page="admin_pimp_profile"] fieldset.theme-field.block-text-studio{
  width:100% !important;
  box-sizing:border-box !important;
}

/* Hero content can use more horizontal room */
body[data-page="pimp_profile"] .pimp-hero .retro-pad,
body[data-page="admin_pimp_profile"] .pimp-hero .retro-pad{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  column-gap:18px !important;
  align-items:start !important;
}

/* Let hero stats stay in the main left part */
body[data-page="pimp_profile"] .pimp-hero-actions,
body[data-page="admin_pimp_profile"] .pimp-hero-actions{
  justify-self:end !important;
  align-self:start !important;
}

/* Footer should span the viewport instead of looking detached */
body[data-page="pimp_profile"] .retro-footer,
body[data-page="admin_pimp_profile"] .retro-footer{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* Make the background area feel filled all the way down */
body[data-page="pimp_profile"]::before,
body[data-page="admin_pimp_profile"]::before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  z-index:-20 !important;
  pointer-events:none !important;
  background:
    linear-gradient(rgba(239,247,252,.48),rgba(239,247,252,.48)),
    var(--site-bg-image,url("../images/buddysocial-fixed-pages-bg-v965.png")) center top / cover fixed !important;
}

/* Do not affect chat */
body[data-page="pimp_profile"] #friend-chat,
body[data-page="pimp_profile"] .friend-chat-window,
body[data-page="admin_pimp_profile"] #friend-chat,
body[data-page="admin_pimp_profile"] .friend-chat-window{
  width:auto !important;
  max-width:none !important;
}

/* Large desktop: give center even more room by keeping sidebars fixed */
@media(min-width:1600px){
  body[data-page="pimp_profile"] main.pimp-page,
  body[data-page="admin_pimp_profile"] main.pimp-page{
    width:calc(100% - 28px) !important;
    margin-left:14px !important;
    margin-right:14px !important;
  }

  body[data-page="pimp_profile"] main.pimp-page.pimp-layout-v987,
  body[data-page="admin_pimp_profile"] main.pimp-page.pimp-layout-v987{
    grid-template-columns:195px minmax(0,1fr) 225px !important;
    gap:10px !important;
  }

  body[data-page="pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav,
  body[data-page="admin_pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav{
    width:195px !important;
    max-width:195px !important;
  }

  body[data-page="pimp_profile"] .pimp-site-rightbar,
  body[data-page="admin_pimp_profile"] .pimp-site-rightbar{
    width:225px !important;
    max-width:225px !important;
  }
}

/* Tablet */
@media(max-width:1050px){
  body[data-page="pimp_profile"] main.pimp-page,
  body[data-page="admin_pimp_profile"] main.pimp-page{
    width:calc(100% - 12px) !important;
    margin:6px !important;
  }

  body[data-page="pimp_profile"] main.pimp-page.pimp-layout-v987,
  body[data-page="admin_pimp_profile"] main.pimp-page.pimp-layout-v987{
    grid-template-columns:175px minmax(0,1fr) !important;
  }

  body[data-page="pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav,
  body[data-page="admin_pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav{
    width:175px !important;
    max-width:175px !important;
  }

  body[data-page="pimp_profile"] .pimp-site-rightbar,
  body[data-page="admin_pimp_profile"] .pimp-site-rightbar{
    width:100% !important;
    max-width:none !important;
    grid-column:2 !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
  }

  body[data-page="pimp_profile"] .pimp-hero .retro-pad,
  body[data-page="admin_pimp_profile"] .pimp-hero .retro-pad{
    display:block !important;
  }
}

/* Mobile */
@media(max-width:760px){
  body[data-page="pimp_profile"] main.pimp-page,
  body[data-page="admin_pimp_profile"] main.pimp-page{
    width:calc(100% - 8px) !important;
    margin:4px 4px 88px !important;
  }

  body[data-page="pimp_profile"] main.pimp-page.pimp-layout-v987,
  body[data-page="admin_pimp_profile"] main.pimp-page.pimp-layout-v987{
    display:block !important;
  }

  body[data-page="pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav,
  body[data-page="admin_pimp_profile"] .pimp-tabs-organized.pimp-site-leftnav,
  body[data-page="pimp_profile"] .pimp-site-center,
  body[data-page="admin_pimp_profile"] .pimp-site-center,
  body[data-page="pimp_profile"] .pimp-site-rightbar,
  body[data-page="admin_pimp_profile"] .pimp-site-rightbar{
    width:100% !important;
    max-width:none !important;
  }

  body[data-page="pimp_profile"] .pimp-site-rightbar,
  body[data-page="admin_pimp_profile"] .pimp-site-rightbar{
    display:block !important;
  }

  body[data-page="pimp_profile"] .pimp-dashboard,
  body[data-page="admin_pimp_profile"] .pimp-dashboard{
    grid-template-columns:1fr !important;
  }

  body[data-page="pimp_profile"]::before,
  body[data-page="admin_pimp_profile"]::before{
    background-attachment:scroll !important;
  }
}
