/**
 * Skillfinder UI V2 — public project and task/service detail pages.
 * Loaded only for audited Workreap product types.
 */

body.sfc-ui-v2-public-detail {
  background: var(--sfc-ui-page, #f7f8fa) !important;
}

body.sfc-ui-v2-public-detail .wr-main-section {
  padding: 42px 0 72px !important;
  background: var(--sfc-ui-page, #f7f8fa) !important;
}

body.sfc-ui-v2-public-detail .wr-main-section > .container {
  width: min(1240px, calc(100% - 48px)) !important;
  max-width: 1240px !important;
  padding-inline: 0 !important;
}

body.sfc-ui-v2-public-detail .wr-main-section .row.gy-4 {
  --bs-gutter-x: 24px;
  --bs-gutter-y: 24px;
  align-items: flex-start !important;
}

body.sfc-ui-v2-public-detail :where(
  .wr-projectbox,
  .wr-servicewrap,
  .wr-servicedetailcontent,
  .wr-servicepkg-tabs
) {
  box-shadow: none !important;
}

/* Public project detail. */
body.sfc-ui-v2-public-project-detail .wr-projectbox {
  display: grid !important;
  gap: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.sfc-ui-v2-public-project-detail .wr-projectbox > .wr-project-box {
  margin: 0 !important;
  padding: 28px 30px !important;
  border: 1px solid var(--sfc-ui-border, #e7eaed) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-project-detail .wr-projectbox > .wr-project-box + .wr-project-box {
  margin-top: 0 !important;
}

body.sfc-ui-v2-public-project-detail :where(.wr-servicedetailtitle, .wr-project-title, .wr-sidebar-title) > :where(h1, h2, h3, h4, h5) {
  margin-top: 0 !important;
  color: var(--sfc-ui-heading, #17191c) !important;
}

body.sfc-ui-v2-public-project-detail .wr-blogviewdates {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 18px !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}

body.sfc-ui-v2-public-project-detail .wr-blogviewdates li {
  margin: 0 !important;
  color: var(--sfc-ui-muted, #69717a) !important;
}

body.sfc-ui-v2-public-project-detail .wr-project-holder {
  margin: 0 !important;
  padding: 24px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--sfc-ui-border, #e7eaed) !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-project-detail .wr-project-box > .wr-project-holder:first-child {
  padding-top: 0 !important;
}

body.sfc-ui-v2-public-project-detail .wr-project-box > .wr-project-holder:last-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

body.sfc-ui-v2-public-project-detail :where(.wr-jobdescription, .wr-jobdescription p, .wr-project-description, .wr-project-description p) {
  color: var(--sfc-ui-text, #4f565e) !important;
  line-height: 1.7 !important;
}

body.sfc-ui-v2-public-project-detail :where(.wr-tags_links, .wr-blog-tags, .wr-project-tags) a {
  border: 1px solid var(--sfc-ui-border, #e7eaed) !important;
  border-radius: 999px !important;
  background: var(--sfc-ui-surface-muted, #f7f8fa) !important;
  color: var(--sfc-ui-text, #4f565e) !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-project-detail .col-lg-5.col-xl-4 > aside {
  position: sticky !important;
  top: 24px !important;
}

body.sfc-ui-v2-public-project-detail .wr-projectprice {
  padding-bottom: 24px !important;
}

body.sfc-ui-v2-public-project-detail .wr-sidebarpkg__btn {
  display: grid !important;
  gap: 10px !important;
  margin-top: 20px !important;
}

body.sfc-ui-v2-public-project-detail .wr-sidebarpkg__btn :where(a, span) {
  width: 100% !important;
  justify-content: center !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-project-detail .wr-project-requirement {
  margin: 18px 0 0 !important;
  padding: 0 !important;
}

body.sfc-ui-v2-public-project-detail .wr-project-requirement > li {
  margin: 0 !important;
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--sfc-ui-border, #e7eaed) !important;
}

body.sfc-ui-v2-public-project-detail .wr-project-requirement > li:last-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

body.sfc-ui-v2-public-project-detail :where(.wr-betaversion-wrap, .wr-betaversion-info, .wr-downloadbtn) {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Public task/service detail. */
body.sfc-ui-v2-public-task-detail .wr-servicewrap {
  display: grid !important;
  gap: 20px !important;
}

body.sfc-ui-v2-public-task-detail :where(
  .wr-sync,
  .wr-singleservice-tile,
  .wr-sidebartabs,
  .wr-aboutfreelancer
) {
  margin: 0 !important;
  border: 1px solid var(--sfc-ui-border, #e7eaed) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-task-detail .wr-sync {
  overflow: hidden !important;
}

body.sfc-ui-v2-public-task-detail .wr-singleservice-tile {
  padding: 28px 30px !important;
}

body.sfc-ui-v2-public-task-detail .wr-servicedetailcontent {
  display: grid !important;
  gap: 20px !important;
}

body.sfc-ui-v2-public-task-detail .wr-servicedetailcontent > * {
  margin: 0 !important;
}

body.sfc-ui-v2-public-task-detail :where(.wr-text-wrapper, .wr-text-wrapper p, .wr-description, .wr-description p) {
  color: var(--sfc-ui-text, #4f565e) !important;
  line-height: 1.7 !important;
}

body.sfc-ui-v2-public-task-detail :where(.wr-additionalservices, .wr-faq, .wr-blogcommentsholder) {
  margin: 18px 0 0 !important;
  padding: 0 !important;
}

body.sfc-ui-v2-public-task-detail .wr-additionalservices > li {
  margin: 0 !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--sfc-ui-border, #e7eaed) !important;
}

body.sfc-ui-v2-public-task-detail .wr-additionalservices > li:last-child {
  border-bottom: 0 !important;
}

body.sfc-ui-v2-public-task-detail .wr-faq__content {
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--sfc-ui-border, #e7eaed) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-task-detail .wr-faq__content:last-child {
  border-bottom: 0 !important;
}

body.sfc-ui-v2-public-task-detail .wr-servicepkg-tabs {
  position: sticky !important;
  top: 24px !important;
  display: grid !important;
  gap: 20px !important;
}

body.sfc-ui-v2-public-task-detail .wr-servicepkg-tabs > :where(.wr-asideholder, .wr-aboutfreelancer) {
  margin: 0 !important;
}

body.sfc-ui-v2-public-task-detail .wr-sidebartabs {
  overflow: hidden !important;
}

body.sfc-ui-v2-public-task-detail .wr-sidebartabs__pkgtitle {
  gap: 4px !important;
  margin: 0 !important;
  padding: 10px !important;
  border-bottom: 1px solid var(--sfc-ui-border, #e7eaed) !important;
  background: #fff !important;
}

body.sfc-ui-v2-public-task-detail .wr-sidebartabs__pkgtitle .nav-link {
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: var(--sfc-ui-muted, #69717a) !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-task-detail .wr-sidebartabs__pkgtitle .nav-link:hover,
body.sfc-ui-v2-public-task-detail .wr-sidebartabs__pkgtitle .nav-link.active {
  background: var(--sfc-ui-primary-soft, #edf8f7) !important;
  color: var(--sfc-ui-primary, #1b8996) !important;
}

body.sfc-ui-v2-public-task-detail .wr-sidebartabs .tab-content {
  padding: 24px !important;
}

body.sfc-ui-v2-public-task-detail .wr-sidebarpkg__btn :where(.wr-btn, a) {
  width: 100% !important;
  justify-content: center !important;
  box-shadow: none !important;
}

body.sfc-ui-v2-public-task-detail .wr-aboutfreelancer {
  padding: 24px !important;
}

body.sfc-ui-v2-public-task-detail :where(.wr-share-section, .wr-pkgresponse) {
  border-color: var(--sfc-ui-border, #e7eaed) !important;
  box-shadow: none !important;
}

@media (max-width: 991px) {
  body.sfc-ui-v2-public-project-detail .col-lg-5.col-xl-4 > aside,
  body.sfc-ui-v2-public-task-detail .wr-servicepkg-tabs {
    position: static !important;
  }
}

@media (max-width: 640px) {
  body.sfc-ui-v2-public-detail .wr-main-section {
    padding: 28px 0 52px !important;
  }

  body.sfc-ui-v2-public-detail .wr-main-section > .container {
    width: min(100% - 24px, 1240px) !important;
  }

  body.sfc-ui-v2-public-project-detail .wr-projectbox > .wr-project-box,
  body.sfc-ui-v2-public-task-detail .wr-singleservice-tile,
  body.sfc-ui-v2-public-task-detail .wr-sidebartabs .tab-content,
  body.sfc-ui-v2-public-task-detail .wr-aboutfreelancer {
    padding: 22px !important;
  }
}
