/* Desktop UX refinements requested 2026-09-08. Loaded last so it can safely override module defaults. */

@media (min-width: 861px) {
  /* Lead-uri: keep one vertical scroll context instead of a nested list scroller. */
  html[data-workspace-module="leads"],
  html[data-workspace-module="leads"] body {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  [data-workspace-module="leads"] .app-shell {
    height: auto !important;
    min-height: 100% !important;
  }

  [data-workspace-module="leads"] .lead-layout,
  [data-workspace-module="leads"] .lead-columns,
  [data-workspace-module="leads"] .list-panel,
  [data-workspace-module="leads"] .lead-list {
    min-height: 0 !important;
    overflow: visible !important;
  }

  [data-workspace-module="leads"] .lead-list {
    padding-right: 0 !important;
    scrollbar-gutter: auto !important;
  }

  /* Once the parent confirms iframe auto-height, the iframe itself stops scrolling. */
  html.r90-leads-autoheight,
  html.r90-leads-autoheight body {
    height: auto !important;
    min-height: 0 !important;
    overflow-y: hidden !important;
  }

  html.r90-leads-autoheight .app-shell {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  html.r90-leads-autoheight #leadForm.editing-modal {
    position: absolute !important;
    top: var(--r90-lead-modal-center, 50vh) !important;
  }

  /* Contracte: use more of the desktop viewport and keep all three panels visually symmetric. */
  .r90-embedded-section[aria-label="Contracte"] .r90-module-iframe {
    height: calc(100dvh - 148px) !important;
    min-height: 690px !important;
  }

  [data-workspace-module="contracts"] .contract-layout {
    height: 100% !important;
    min-height: 690px !important;
    align-items: stretch !important;
  }

  [data-workspace-module="contracts"] .client-panel,
  [data-workspace-module="contracts"] .editor-panel,
  [data-workspace-module="contracts"] .preview-panel {
    height: 100% !important;
    min-height: 0 !important;
  }

  [data-workspace-module="contracts"] .preview-panel .docx-preview {
    min-height: 610px !important;
  }

  /* A zoomed contract stays centered and the preview owns horizontal scrolling. */
  [data-workspace-module="contracts"] .docx-preview {
    overflow-x: auto !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  [data-workspace-module="contracts"] .docx-preview .docx-wrapper {
    width: max-content !important;
    min-width: 100% !important;
    align-items: center !important;
    box-sizing: border-box;
  }

  [data-workspace-module="contracts"] .r90-preview-sheet {
    display: block;
    flex: 0 0 auto;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  [data-workspace-module="contracts"] .r90-preview-sheet > section.docx {
    transform-origin: top left !important;
  }

  /* Progress Hub: translucent frosted-glass upper surface with softly moving pink light. */
  .r90p-overlay {
    background:
      radial-gradient(circle at 12% 5%, rgba(255, 77, 139, 0.13), transparent 30%),
      radial-gradient(circle at 90% 11%, rgba(196, 60, 126, 0.10), transparent 26%),
      var(--r90p-bg) !important;
  }

  .r90p-topbar,
  .r90p-mode-banner,
  .r90p-kpi,
  .r90p-panel {
    background: color-mix(in srgb, var(--r90p-bg-elevated) 72%, transparent) !important;
    border-color: color-mix(in srgb, var(--r90p-border) 74%, rgba(255,255,255,.28)) !important;
    box-shadow:
      0 16px 46px color-mix(in srgb, var(--r90p-text) 7%, transparent),
      inset 0 1px 0 rgba(255,255,255,.36) !important;
    backdrop-filter: blur(22px) saturate(1.35) !important;
    -webkit-backdrop-filter: blur(22px) saturate(1.35) !important;
  }

  .r90p-client-title,
  .r90p-close,
  .r90p-profile__journey,
  .r90p-icon-button {
    backdrop-filter: blur(16px) saturate(1.3);
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
  }

  .r90p-profile {
    position: relative;
    isolation: isolate;
    color: var(--r90p-text) !important;
    background: color-mix(in srgb, var(--r90p-bg-elevated) 68%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--r90p-border) 68%, rgba(255,255,255,.34)) !important;
    box-shadow:
      0 22px 68px rgba(93, 35, 65, 0.13),
      inset 0 1px 0 rgba(255,255,255,.45) !important;
    backdrop-filter: blur(30px) saturate(1.45) !important;
    -webkit-backdrop-filter: blur(30px) saturate(1.45) !important;
  }

  .r90p-profile::before,
  .r90p-profile::after {
    filter: blur(28px) !important;
    opacity: .78;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    will-change: transform;
  }

  .r90p-profile::before {
    top: -90px !important;
    left: -55px !important;
    right: auto !important;
    width: 280px !important;
    height: 280px !important;
    background: radial-gradient(circle, rgba(255, 77, 139, .52), rgba(255, 77, 139, .12) 48%, transparent 72%) !important;
    animation-name: r90p-orbit-a;
    animation-duration: 16s;
  }

  .r90p-profile::after {
    right: -45px !important;
    bottom: -120px !important;
    width: 330px !important;
    height: 330px !important;
    background: radial-gradient(circle, rgba(221, 87, 151, .38), rgba(148, 18, 70, .12) 48%, transparent 72%) !important;
    animation-name: r90p-orbit-b;
    animation-duration: 20s;
  }

  .r90p-profile__copy,
  .r90p-profile__journey,
  .r90p-profile-edit {
    position: relative;
    z-index: 2;
  }

  .r90p-profile h2,
  .r90p-profile__numbers strong {
    color: var(--r90p-text) !important;
  }

  .r90p-profile .r90p-eyebrow,
  .r90p-profile__numbers .is-current strong,
  .r90p-profile__progress-copy strong {
    color: var(--r90p-accent-strong) !important;
  }

  .r90p-profile__copy p,
  .r90p-profile__numbers small,
  .r90p-profile__progress-copy {
    color: var(--r90p-text-soft) !important;
  }

  .r90p-profile__journey {
    background: color-mix(in srgb, var(--r90p-bg-elevated) 48%, transparent) !important;
    border-color: color-mix(in srgb, var(--r90p-border) 65%, rgba(255,255,255,.32)) !important;
  }

  .r90p-profile-edit {
    color: var(--r90p-accent-strong) !important;
    background: color-mix(in srgb, var(--r90p-bg-elevated) 56%, transparent) !important;
    border-color: color-mix(in srgb, var(--r90p-border) 60%, rgba(255,255,255,.3)) !important;
  }
}

/* Avatar synchronization is useful at every viewport size. */
.r90p-avatar {
  overflow: hidden;
}

.r90p-avatar > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

@keyframes r90p-orbit-a {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  35% { transform: translate3d(160px, 36px, 0) scale(1.08); }
  70% { transform: translate3d(330px, -6px, 0) scale(.94); }
  100% { transform: translate3d(520px, 42px, 0) scale(1.04); }
}

@keyframes r90p-orbit-b {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  40% { transform: translate3d(-190px, -48px, 0) scale(.92); }
  75% { transform: translate3d(-390px, 20px, 0) scale(1.08); }
  100% { transform: translate3d(-560px, -28px, 0) scale(.98); }
}

@media (prefers-reduced-motion: reduce) {
  .r90p-profile::before,
  .r90p-profile::after {
    animation: none !important;
  }
}

/* Continuous ambient motion for the Progress Hub hero, including phones. */
#reshape90-progress-hub .r90p-profile {
  isolation: isolate;
}

#reshape90-progress-hub .r90p-profile::before,
#reshape90-progress-hub .r90p-profile::after {
  z-index: -1;
  filter: blur(30px) !important;
  opacity: .76;
  animation-timing-function: linear !important;
  animation-iteration-count: infinite !important;
  animation-direction: normal !important;
  will-change: transform, opacity;
}

#reshape90-progress-hub .r90p-profile::before {
  top: -92px !important;
  right: auto !important;
  left: -62px !important;
  width: 286px !important;
  height: 286px !important;
  background: radial-gradient(circle, rgba(255, 77, 139, .50), rgba(255, 77, 139, .13) 48%, transparent 72%) !important;
  animation-name: r90p-orbit-a-loop !important;
  animation-duration: 27s !important;
}

#reshape90-progress-hub .r90p-profile::after {
  right: -62px !important;
  bottom: -134px !important;
  width: 326px !important;
  height: 326px !important;
  background: radial-gradient(circle, rgba(221, 87, 151, .40), rgba(148, 18, 70, .13) 48%, transparent 72%) !important;
  animation-name: r90p-orbit-b-loop !important;
  animation-duration: 34s !important;
}

@keyframes r90p-orbit-a-loop {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); opacity: .72; }
  16% { transform: translate3d(42%, 16%, 0) scale(1.08); opacity: .82; }
  34% { transform: translate3d(118%, -7%, 0) scale(.95); opacity: .70; }
  53% { transform: translate3d(184%, 18%, 0) scale(1.04); opacity: .78; }
  70% { transform: translate3d(128%, 39%, 0) scale(.92); opacity: .66; }
  86% { transform: translate3d(43%, -13%, 0) scale(1.06); opacity: .80; }
}

@keyframes r90p-orbit-b-loop {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); opacity: .68; }
  18% { transform: translate3d(-43%, -13%, 0) scale(.93); opacity: .76; }
  37% { transform: translate3d(-112%, 19%, 0) scale(1.07); opacity: .64; }
  56% { transform: translate3d(-178%, -6%, 0) scale(.98); opacity: .79; }
  74% { transform: translate3d(-124%, -29%, 0) scale(1.09); opacity: .70; }
  89% { transform: translate3d(-47%, 13%, 0) scale(.95); opacity: .76; }
}

@media (max-width: 860px) {
  #reshape90-progress-hub .r90p-profile {
    background: color-mix(in srgb, var(--r90p-bg-elevated) 76%, transparent) !important;
    border-color: color-mix(in srgb, var(--r90p-border) 70%, rgba(255, 255, 255, .30)) !important;
    box-shadow: 0 16px 46px rgba(93, 35, 65, .10), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.35) !important;
    backdrop-filter: blur(24px) saturate(1.35) !important;
  }

  #reshape90-progress-hub .r90p-profile::before {
    top: -74px !important;
    left: -58px !important;
    width: 214px !important;
    height: 214px !important;
    animation-duration: 23s !important;
  }

  #reshape90-progress-hub .r90p-profile::after {
    right: -70px !important;
    bottom: -108px !important;
    width: 244px !important;
    height: 244px !important;
    animation-duration: 29s !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #reshape90-progress-hub .r90p-profile::before,
  #reshape90-progress-hub .r90p-profile::after {
    animation: none !important;
    will-change: auto;
  }
}

/* Progress Hub neutral studio canvas.
   Pink stays inside the profile story and actions instead of tinting the page. */
html[data-theme="light"] #reshape90-progress-hub.r90p-overlay {
  --r90p-bg: #f3f2f1;
  --r90p-bg-elevated: #ffffff;
  --r90p-bg-soft: #f8f7f6;
  --r90p-bg-muted: #efedec;
  --r90p-text: #252223;
  --r90p-text-soft: #686164;
  --r90p-text-subtle: #81797d;
  --r90p-border: rgba(42, 36, 38, .11);
  --r90p-border-strong: rgba(42, 36, 38, .18);
  --r90p-grid: rgba(42, 36, 38, .075);
  --r90p-shadow: 0 20px 54px rgba(36, 31, 33, .08);
  --r90p-shadow-soft: 0 10px 30px rgba(36, 31, 33, .06);
  background: linear-gradient(180deg, #fbfbfa 0%, #f3f2f1 58%, #efedec 100%) !important;
}

html[data-theme="light"] #reshape90-progress-hub .r90p-topbar,
html[data-theme="light"] #reshape90-progress-hub .r90p-mode-banner,
html[data-theme="light"] #reshape90-progress-hub .r90p-loading,
html[data-theme="light"] #reshape90-progress-hub .r90p-kpi,
html[data-theme="light"] #reshape90-progress-hub .r90p-panel {
  background: rgba(255, 255, 255, .92) !important;
  border-color: rgba(42, 36, 38, .11) !important;
  box-shadow:
    0 12px 34px rgba(36, 31, 33, .065),
    inset 0 1px 0 rgba(255, 255, 255, .94) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.08) !important;
  backdrop-filter: blur(20px) saturate(1.08) !important;
}

html[data-theme="light"] #reshape90-progress-hub .r90p-topbar {
  background: rgba(251, 251, 250, .88) !important;
  box-shadow: 0 8px 26px rgba(36, 31, 33, .045) !important;
}

html[data-theme="light"] #reshape90-progress-hub .r90p-profile {
  background: rgba(255, 255, 255, .86) !important;
  border-color: rgba(42, 36, 38, .13) !important;
  box-shadow:
    0 18px 46px rgba(36, 31, 33, .08),
    inset 0 1px 0 rgba(255, 255, 255, .96) !important;
}

html[data-theme="light"] #reshape90-progress-hub .r90p-profile__journey {
  background: rgba(255, 255, 255, .76) !important;
  border-color: rgba(42, 36, 38, .10) !important;
}

html[data-theme="dark"] #reshape90-progress-hub.r90p-overlay {
  --r90p-bg: #111010;
  --r90p-bg-elevated: #1c1a1b;
  --r90p-bg-soft: #232122;
  --r90p-bg-muted: #2b2829;
  --r90p-text: #faf8f8;
  --r90p-text-soft: #c6c0c2;
  --r90p-text-subtle: #9b9396;
  --r90p-border: rgba(255, 255, 255, .10);
  --r90p-border-strong: rgba(255, 255, 255, .17);
  --r90p-grid: rgba(255, 255, 255, .07);
  background: linear-gradient(180deg, #111010 0%, #171516 100%) !important;
}

html[data-theme="dark"] #reshape90-progress-hub .r90p-topbar,
html[data-theme="dark"] #reshape90-progress-hub .r90p-mode-banner,
html[data-theme="dark"] #reshape90-progress-hub .r90p-loading,
html[data-theme="dark"] #reshape90-progress-hub .r90p-kpi,
html[data-theme="dark"] #reshape90-progress-hub .r90p-panel {
  background: rgba(28, 26, 27, .92) !important;
  border-color: rgba(255, 255, 255, .10) !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html[data-theme="dark"] #reshape90-progress-hub .r90p-profile {
  background: rgba(28, 26, 27, .86) !important;
  border-color: rgba(255, 255, 255, .12) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .26), inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

@media (max-width: 767px) {
  html[data-theme="light"] #reshape90-progress-hub .r90p-kpi,
  html[data-theme="light"] #reshape90-progress-hub .r90p-panel {
    box-shadow: 0 8px 24px rgba(36, 31, 33, .055), inset 0 1px 0 rgba(255, 255, 255, .92) !important;
  }
}