/* BuddySocial v9.81 - collapsed by default + per-block test mode */

/* collapsed is the default visual mode */
body[data-page="pimp_profile"] #blocks fieldset.theme-field.block-text-studio.pimp-block-collapsed{
  padding-bottom:0 !important;
  min-height:0 !important;
}

body[data-page="pimp_profile"] #blocks fieldset.theme-field.block-text-studio.pimp-block-collapsed > *:not(.pimp-block-toolbar){
  display:none !important;
}

/* toolbar slightly more compact in default state */
body[data-page="pimp_profile"] #blocks .pimp-block-toolbar{
  margin-bottom:0 !important;
}

body[data-page="pimp_profile"] #blocks fieldset:not(.pimp-block-collapsed) .pimp-block-toolbar{
  margin-bottom:9px !important;
}

/* test button */
body[data-page="pimp_profile"] #blocks .pimp-test-block{
  min-height:29px !important;
  padding:4px 8px !important;
  border:1px solid #8db8d6 !important;
  background:linear-gradient(180deg,#eef8ff,#dceef9) !important;
  color:#245f89 !important;
  font-size:9px !important;
  font-weight:900 !important;
  border-radius:4px !important;
  cursor:pointer !important;
}

body[data-page="pimp_profile"] #blocks .pimp-test-active .pimp-test-block{
  border-color:#d99b2f !important;
  background:linear-gradient(180deg,#fff5d8,#f6d98f) !important;
  color:#855600 !important;
  box-shadow:0 0 0 3px rgba(243,154,19,.10) !important;
}

/* active test block is easy to spot */
body[data-page="pimp_profile"] #blocks fieldset.pimp-test-active{
  border-color:#e0a43a !important;
  box-shadow:0 0 0 3px rgba(243,154,19,.10),0 4px 14px rgba(33,65,89,.10) !important;
}

body[data-page="pimp_profile"] #blocks fieldset.pimp-test-active .pimp-block-toolbar{
  background:linear-gradient(180deg,#fff4d6,#f2d589) !important;
  border-bottom-color:#d7ad55 !important;
}

body[data-page="pimp_profile"] #blocks fieldset.pimp-test-active .pimp-block-number{
  background:#e58b08 !important;
}

/* TESTMODUS badge only visible for active block */
body[data-page="pimp_profile"] #blocks .pimp-test-badge{
  display:none !important;
}

body[data-page="pimp_profile"] #blocks .pimp-preview-test-active .pimp-test-badge{
  display:inline-flex !important;
  position:absolute !important;
  left:8px !important;
  top:7px !important;
  z-index:5 !important;
  padding:3px 7px !important;
  border-radius:999px !important;
  background:#f39a13 !important;
  color:#fff !important;
  border:1px solid #c77600 !important;
  box-shadow:0 2px 6px rgba(170,94,0,.18) !important;
  font-size:8px !important;
  font-weight:900 !important;
  letter-spacing:.05em !important;
}

/* preview frame reacts visibly */
body[data-page="pimp_profile"] #blocks .pimp-preview-test-active{
  min-height:120px !important;
  outline:2px solid rgba(243,154,19,.35) !important;
  outline-offset:2px !important;
  transition:
    background-color .16s ease,
    border-color .16s ease,
    border-radius .16s ease,
    color .16s ease,
    font-size .16s ease,
    box-shadow .16s ease,
    transform .16s ease !important;
}

body[data-page="pimp_profile"] #blocks .pimp-preview-test-active::after{
  content:"Alle wijzigingen hieronder zie je direct in dit testframe" !important;
  position:absolute !important;
  right:8px !important;
  top:7px !important;
  max-width:45% !important;
  padding:3px 6px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.82) !important;
  color:#547287 !important;
  border:1px solid rgba(162,188,205,.75) !important;
  font-size:7px !important;
  font-weight:800 !important;
  text-align:right !important;
  z-index:4 !important;
}

body[data-page="pimp_profile"] #blocks .pimp-preview-pulse{
  transform:scale(1.004) !important;
  box-shadow:0 0 0 4px rgba(243,154,19,.10),0 3px 12px rgba(31,65,91,.10) !important;
}

/* controls are more clearly grouped in test/edit mode */
body[data-page="pimp_profile"] #blocks fieldset:not(.pimp-block-collapsed) .theme-color-row,
body[data-page="pimp_profile"] #blocks fieldset:not(.pimp-block-collapsed) .theme-setting-grid{
  border-left:3px solid #8fb9d5 !important;
}

body[data-page="pimp_profile"] #blocks fieldset.pimp-test-active .theme-color-row,
body[data-page="pimp_profile"] #blocks fieldset.pimp-test-active .theme-setting-grid{
  border-left-color:#f0a020 !important;
}

/* helper note in savebar */
body[data-page="pimp_profile"] #blocks .pimp-test-save-note{
  display:block !important;
  margin-top:3px !important;
  color:#86611d !important;
  font-size:8px !important;
  font-weight:700 !important;
}

/* compact toolbar buttons on mobile */
@media(max-width:760px){
  body[data-page="pimp_profile"] #blocks .pimp-block-toolbar-actions{
    grid-template-columns:1fr 1fr 1fr !important;
  }

  body[data-page="pimp_profile"] #blocks .pimp-preview-test-active::after{
    display:none !important;
  }
}
