/* Mi progreso: presentación clara, espaciosa y accesible. */
#sgl-desktop-app .sgl-view[data-view="progress"] {
  position: relative;
  padding: 24px 28px 44px !important;
  color: #0c1d38 !important;
  background: #f5f8fc !important;
  background-image: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"]::before,
#sgl-desktop-app .sgl-view[data-view="progress"]::after {
  display: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-page-heading {
  margin: 0 0 28px !important;
  padding: 22px 26px !important;
  color: #0c1d38 !important;
  background: #ffffff !important;
  border: 1px solid #d6e2ef !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 24px rgba(15, 45, 82, .08) !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-page-heading h1,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-page-heading p {
  color: #0c1d38 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-page-heading p {
  color: #617189 !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-double-goal-title {
  margin: 6px 0 30px !important;
  gap: 18px !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-double-goal-title::before,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-double-goal-title::after {
  height: 1px !important;
  background: #d5dfeb !important;
  box-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-double-goal-title strong {
  min-width: 280px !important;
  padding: 12px 24px !important;
  color: #15345d !important;
  background: #ffffff !important;
  border: 1px solid #d3deeb !important;
  border-radius: 999px !important;
  box-shadow: 0 5px 14px rgba(18, 53, 92, .08) !important;
  text-shadow: none !important;
  letter-spacing: .025em !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-double-goal-title strong::before,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-double-goal-title strong::after {
  color: #e3ad1f !important;
  filter: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 30px !important;
  margin: 0 0 28px !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 180px minmax(0, 1fr) !important;
  grid-template-rows: auto 1fr !important;
  column-gap: 30px !important;
  row-gap: 18px !important;
  min-width: 0 !important;
  min-height: 390px !important;
  padding: 36px 30px 30px !important;
  overflow: visible !important;
  color: #0c1d38 !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #d6e2ef !important;
  border-top: 5px solid #1675ed !important;
  border-radius: 20px !important;
  box-shadow: 0 10px 28px rgba(16, 48, 84, .09) !important;
  animation: none !important;
  transform: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales {
  border-top-color: #1aa653 !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card::after {
  display: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card::before {
  top: -17px !important;
  left: 28px !important;
  right: auto !important;
  width: auto !important;
  height: auto !important;
  padding: 7px 18px !important;
  color: #ffffff !important;
  background: #1675ed !important;
  border: 3px solid #ffffff !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 10px rgba(22, 117, 237, .18) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: .09em !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales::before {
  background: #1aa653 !important;
  box-shadow: 0 4px 10px rgba(26, 166, 83, .18) !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card h2 {
  grid-column: 1 / -1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  margin: 0 !important;
  color: #1263c7 !important;
  font-size: clamp(25px, 2vw, 34px) !important;
  line-height: 1.15 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales h2 {
  color: #168c47 !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card h2 i {
  display: grid !important;
  place-items: center !important;
  width: 48px !important;
  height: 48px !important;
  flex: 0 0 48px !important;
  color: #ffffff !important;
  background: #1675ed !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 5px 12px rgba(22, 117, 237, .22) !important;
  font-size: 21px !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales h2 i {
  background: #1aa653 !important;
  box-shadow: 0 5px 12px rgba(26, 166, 83, .22) !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring {
  align-self: center !important;
  justify-self: center !important;
  width: 168px !important;
  height: 168px !important;
  color: #0c1d38 !important;
  background: conic-gradient(#1675ed calc(var(--ring, 0) * 1%), #e5ebf3 0) !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 7px 18px rgba(18, 54, 94, .10) !important;
  animation: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales .sgl-goal-ring {
  background: conic-gradient(#1aa653 calc(var(--ring, 0) * 1%), #e5ebf3 0) !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring::before {
  inset: 11px !important;
  background: #ffffff !important;
  border: 1px solid #e0e8f1 !important;
  box-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring::after {
  display: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring b,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring span,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring small {
  position: relative !important;
  z-index: 2 !important;
  color: #0c1d38 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring b {
  font-size: 29px !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list {
  align-self: center !important;
  display: grid !important;
  gap: 13px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 42px auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 13px !important;
  min-width: 0 !important;
  min-height: 66px !important;
  padding: 11px 16px !important;
  color: #0c1d38 !important;
  background: #f8fafc !important;
  border: 1px solid #dbe5ef !important;
  border-radius: 14px !important;
  box-shadow: 0 3px 8px rgba(15, 45, 82, .05) !important;
  transform: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li::before,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li::after {
  display: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li i {
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  color: #1269d2 !important;
  background: #e9f2ff !important;
  border: 0 !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  font-size: 18px !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales .sgl-goal-list li i {
  color: #168c47 !important;
  background: #e9f8ef !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li b {
  color: #0c1d38 !important;
  font-size: 27px !important;
  line-height: 1 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li span,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li small {
  min-width: 0 !important;
  color: #43536a !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-warning {
  margin: 0 0 28px !important;
  padding: 18px 22px !important;
  color: #b42318 !important;
  background: #fff6f5 !important;
  border: 1px solid #f4b5af !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  text-shadow: none !important;
  animation: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-level-track,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-progress-levels,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-level-roadmap {
  color: #0c1d38 !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #d6e2ef !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 24px rgba(15, 45, 82, .08) !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-level-track h3,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-level-track strong,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-level-track b,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-level-roadmap h3,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-level-roadmap strong {
  color: #0c1d38 !important;
  text-shadow: none !important;
}

@media (max-width: 1180px) {
  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-grid {
    grid-template-columns: 1fr !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card {
    min-height: 360px !important;
  }
}

@media (max-width: 720px) {
  #sgl-desktop-app .sgl-view[data-view="progress"] {
    padding: 16px 12px 32px !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-page-heading {
    padding: 18px !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-double-goal-title strong {
    min-width: 0 !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    padding: 34px 18px 22px !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card h2 {
    font-size: 25px !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-ring {
    width: 150px !important;
    height: 150px !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-list li {
    grid-template-columns: 40px auto minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 10px 12px !important;
  }
}

/* Selectores usados por la plantilla actual. */
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring {
  position: relative !important;
  align-self: center !important;
  justify-self: center !important;
  display: grid !important;
  place-content: center !important;
  width: 168px !important;
  height: 168px !important;
  margin: 0 !important;
  color: #0c1d38 !important;
  background: conic-gradient(#1675ed calc(var(--ring, 0) * 1%), #e5ebf3 0) !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 7px 18px rgba(18, 54, 94, .10) !important;
  animation: none !important;
  transform: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales .sgl-ring {
  background: conic-gradient(#1aa653 calc(var(--ring, 0) * 1%), #e5ebf3 0) !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring::before {
  position: absolute !important;
  inset: 11px !important;
  display: block !important;
  content: "" !important;
  background: #ffffff !important;
  border: 1px solid #e0e8f1 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring::after {
  display: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring strong,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring b,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring span {
  position: relative !important;
  z-index: 2 !important;
  color: #0c1d38 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring strong {
  display: block !important;
  font-size: 26px !important;
  line-height: 1.15 !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring span {
  display: block !important;
  margin-top: 5px !important;
  color: #4d5e75 !important;
  font-size: 14px !important;
  text-align: center !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul {
  align-self: center !important;
  display: grid !important;
  gap: 13px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul > li {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  min-width: 0 !important;
  min-height: 66px !important;
  margin: 0 !important;
  padding: 11px 16px !important;
  color: #43536a !important;
  background: #f8fafc !important;
  border: 1px solid #dbe5ef !important;
  border-radius: 14px !important;
  box-shadow: 0 3px 8px rgba(15, 45, 82, .05) !important;
  transform: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul > li::before,
#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul > li::after {
  display: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul > li i {
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  color: #1269d2 !important;
  background: #e9f2ff !important;
  border: 0 !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  font-size: 18px !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card.sales > ul > li i {
  color: #168c47 !important;
  background: #e9f8ef !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul > li b {
  flex: 0 0 auto !important;
  color: #0c1d38 !important;
  font-size: 27px !important;
  line-height: 1 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul > li span {
  color: #43536a !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  text-shadow: none !important;
}

#sgl-desktop-app .sgl-view[data-view="progress"] .sgl-warning {
  margin: 0 0 28px !important;
  padding: 18px 22px !important;
  color: #b42318 !important;
  background: #fff6f5 !important;
  background-image: none !important;
  border: 1px solid #f4b5af !important;
  border-radius: 15px !important;
  box-shadow: none !important;
  text-shadow: none !important;
  animation: none !important;
  transform: none !important;
}

@media (max-width: 720px) {
  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-ring {
    width: 150px !important;
    height: 150px !important;
  }

  #sgl-desktop-app .sgl-view[data-view="progress"] .sgl-goal-card > ul > li {
    gap: 10px !important;
    padding: 10px 12px !important;
  }
}
