/* v17 — profile artwork, standard Settings sidebar, visible Customize icon. */
:root {
  --dnxt-v17-sidebar: #007380;
  --dnxt-v17-sidebar-dark: #072b2f;
  --dnxt-v17-button: #006875;
  --dnxt-v17-button-hover: #00535e;
  --dnxt-v17-page-art: url('/img/workspace-bg-diagonal-green.svg?v=20260713-v17');
  --dnxt-v17-card-art: url('/img/side-card-bg.png?v=20260713-v17');
}

/* Profile page: always show the green image throughout the main content area. */
body[data-page="profile"] .workspace {
  background-color: #f6fbfc !important;
  background-image:
    linear-gradient(rgba(255,255,255,.62), rgba(246,251,252,.76)),
    var(--dnxt-v17-page-art),
    var(--dnxt-v17-card-art) !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
  background-position: center center, center center, center center !important;
  background-size: cover, cover, cover !important;
}
body[data-page="profile"] .profile-page,
body[data-page="profile"] .profile-content,
body[data-page="profile"] .profile-layout,
body[data-page="profile"] .content-layout,
body[data-page="profile"] .canvas-area,
body[data-page="profile"] main > section {
  background-color: transparent !important;
}

/* Settings sidebar must match the normal sidebar used on every other app page. */
body[data-page="settings"] .sidebar {
  background-color: var(--dnxt-v17-sidebar) !important;
  background-image: linear-gradient(180deg, var(--dnxt-v17-sidebar), var(--dnxt-v17-sidebar-dark)) !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  border-right: 0 !important;
  box-shadow: none !important;
}
body[data-page="settings"] .sidebar .brand,
body[data-page="settings"] .sidebar .side-nav,
body[data-page="settings"] .sidebar .side-group,
body[data-page="settings"] .sidebar .sidebar-footer,
body[data-page="settings"] .sidebar .create-wrapper,
body[data-page="settings"] .sidebar .project-list,
body[data-page="settings"] .sidebar .teams-sidebar-list {
  background: transparent !important;
}
body[data-page="settings"] .sidebar .nav-link,
body[data-page="settings"] .sidebar .side-heading,
body[data-page="settings"] .sidebar .project-item,
body[data-page="settings"] .sidebar .team-sidebar-item,
body[data-page="settings"] .sidebar .mini-icon,
body[data-page="settings"] .sidebar i,
body[data-page="settings"] .sidebar span {
  color: #ffffff !important;
}
body[data-page="settings"] .sidebar .nav-link:hover,
body[data-page="settings"] .sidebar .nav-link.active,
body[data-page="settings"] .sidebar .project-item:hover,
body[data-page="settings"] .sidebar .team-sidebar-item:hover {
  background: rgba(255,255,255,.13) !important;
}

/* Customize control: force a visible green button and a crisp white icon. */
.project-header-actions #customizeBtn,
#customizeBtn,
button#customizeBtn {
  background: var(--dnxt-v17-button) !important;
  border: 1px solid var(--dnxt-v17-button) !important;
  color: #ffffff !important;
  opacity: 1 !important;
  box-shadow: 0 7px 16px rgba(0,72,82,.18) !important;
}
.project-header-actions #customizeBtn:hover,
#customizeBtn:hover,
button#customizeBtn:hover {
  background: var(--dnxt-v17-button-hover) !important;
  border-color: var(--dnxt-v17-button-hover) !important;
  color: #ffffff !important;
}
.project-header-actions #customizeBtn i,
#customizeBtn i,
button#customizeBtn i,
#customizeBtn svg,
#customizeBtn svg * {
  color: #ffffff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html[data-theme="dark"] body[data-page="profile"] .workspace {
  background-color: #061617 !important;
  background-image:
    linear-gradient(rgba(4,15,16,.84), rgba(4,15,16,.90)),
    var(--dnxt-v17-page-art),
    var(--dnxt-v17-card-art) !important;
}
html[data-theme="dark"] body[data-page="settings"] .sidebar {
  background-color: #072b2f !important;
  background-image: linear-gradient(180deg, #007380, #052327) !important;
}
