/*
 * Fondos reales de pantalla v0.65.0.
 * El ambiente pertenece al área principal, no a cada vista/contenedor.
 */

#sgl-desktop-app .sgl-main {
  min-height: 100vh;
  background-color: #dcecff !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
}

#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="home"].is-active),
#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="lead"].is-active),
#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="progress"].is-active) {
  background-image:
    linear-gradient(180deg, rgba(224, 240, 255, .50), rgba(216, 235, 252, .66)),
    url("images/area-backgrounds-v063/kingdom-blue.png") !important;
}

#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="contacts"].is-active),
#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="touches"].is-active),
#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="settings"].is-active),
#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="supervision"].is-active) {
  background-color: #d9f2ed !important;
  background-image:
    linear-gradient(180deg, rgba(224, 247, 242, .50), rgba(214, 240, 235, .67)),
    url("images/area-backgrounds-v063/operations-emerald.png") !important;
}

#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="challenges"].is-active),
#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="rewards"].is-active),
#sgl-desktop-app .sgl-main:has(> .sgl-view[data-view="messages"].is-active) {
  background-color: #e5e0fa !important;
  background-image:
    linear-gradient(180deg, rgba(235, 230, 253, .50), rgba(225, 218, 249, .67)),
    url("images/area-backgrounds-v063/rewards-purple.png") !important;
}

/* Neutraliza el efecto de tarjeta gigante introducido en v0.63. */
#sgl-desktop-app .sgl-view[data-view="home"],
#sgl-desktop-app .sgl-view[data-view="lead"],
#sgl-desktop-app .sgl-view[data-view="progress"],
#sgl-desktop-app .sgl-view[data-view="contacts"],
#sgl-desktop-app .sgl-view[data-view="touches"],
#sgl-desktop-app .sgl-view[data-view="settings"],
#sgl-desktop-app .sgl-view[data-view="supervision"],
#sgl-desktop-app .sgl-view[data-view="challenges"],
#sgl-desktop-app .sgl-view[data-view="rewards"],
#sgl-desktop-app .sgl-view[data-view="messages"] {
  background-color: transparent !important;
  background-image: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Los paneles siguen siendo nítidos; el fondo vive detrás de ellos. */
#sgl-desktop-app .sgl-view[data-view="home"] .sgl-opportunity-card,
#sgl-desktop-app .sgl-view[data-view="lead"] .sgl-lead-layout,
#sgl-desktop-app .sgl-view[data-view="contacts"] .sgl-workspace-card,
#sgl-desktop-app .sgl-view[data-view="touches"] .sgl-workspace-card,
#sgl-desktop-app .sgl-view[data-view="settings"] .sgl-profile-card,
#sgl-desktop-app .sgl-view[data-view="supervision"] .sgl-supervisor-card,
#sgl-desktop-app .sgl-view[data-view="challenges"] .sgl-challenge-card,
#sgl-desktop-app .sgl-view[data-view="rewards"] .sgl-reward-card,
#sgl-desktop-app .sgl-view[data-view="messages"] .sgl-message-card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

@media (max-width: 900px) {
  #sgl-desktop-app .sgl-main {
    background-position: center top !important;
    background-size: auto 100vh !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  #sgl-desktop-app .sgl-main {
    background-image: none !important;
  }
}