/* Zé Apostas V3 · Context Workspace */

.za-context-workspace {
  --za-workspace-safe-gap:36px;
  --za-workspace-max-width:1180px;
  position: fixed;
  inset: 0;
  z-index: 30;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
}

.za-context-workspace[aria-hidden="false"] {
  opacity: 1;
  pointer-events: auto;
}

.za-context-workspace__backdrop {
  position: absolute;
  inset: 0;
  background: var(--za-bg-surface-variant-151,rgba(2, 6, 23, .64));
  backdrop-filter: blur(10px);
}

.za-context-workspace__panel {
  position: relative;
  z-index: 1;
  width: min(var(--za-workspace-max-width), calc(100vw - var(--za-workspace-safe-gap)));
  max-width: calc(100vw - var(--za-workspace-safe-gap));
  margin-inline:auto;
  max-height: min(760px, calc(100dvh - 36px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--za-border-subtle-variant-107,rgba(125, 211, 252, .22));
  border-radius: 18px;
  background: var(--za-bg-surface-variant-152,rgba(8, 15, 29, .98));
  color: var(--za-text-primary-variant-6,#f8fafc);
  box-shadow: 0 30px 90px var(--za-shadow-color-variant-37,rgba(0, 0, 0, .48));
  transform: translateY(-8px) scale(.992);
  transition: transform .18s ease;
}

.za-context-workspace[aria-hidden="false"] .za-context-workspace__panel {
  transform: translateY(0) scale(1);
}

.za-context-workspace__header {
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: 62px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--za-border-subtle-variant-108,rgba(148, 163, 184, .16));
  background: var(--za-bg-surface-variant-152,rgba(8, 15, 29, .98));
}

.za-context-workspace__header h2 {
  margin: 0;
  min-width: 0;
  color: var(--za-text-primary-variant-6,#f8fafc);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.2;
}

.za-context-workspace__header button {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--za-text-primary-variant-10,#e0f2fe);
  font-size: 0;
  line-height: 1;
  cursor: pointer;
}

.za-context-workspace__header button svg {
  width: 18px;
  height: 19px;
  display: block;
  fill: currentColor;
}

.za-context-workspace__header button:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: none;
}

.za-context-workspace__heading {
  grid-column: 2;
  min-width: 0;
  max-width: 100%;
}

#zaWorkspaceClose {
  grid-column: 3;
  justify-self: end;
  align-self: center;
}

.za-context-workspace__back {
  grid-column: 1;
  justify-self: start;
  align-self: center;
}

.za-context-workspace__header button:focus-visible {
  outline: 2px solid var(--za-border-subtle-variant-109,#67e8f9);
  outline-offset: 3px;
}

.za-context-workspace__body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-padding-top: 18px;
  padding: 18px;
  color: var(--za-text-secondary-variant-1,#cbd5e1);
}


/* R25.4.33.18 · Dashboard sticky docking
   The workspace body owns the scroll. For Desempenho only, remove its top
   padding from the scroll container so the sticky controls can dock flush
   below the workspace header. The module restores the initial visual space. */
.za-context-workspace__body:has(.za-workspace-module--dashboard) {
  padding-top: 0;
  scroll-padding-top: 0;
}

.za-context-workspace__body:has(.za-workspace-module--dashboard) > .za-workspace-module--dashboard {
  padding-top: 18px;
}

.za-context-workspace__body p {
  margin: 0 0 14px;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .za-context-workspace {
    align-items: flex-start;
    justify-content: center;
    padding: max(8px, env(safe-area-inset-top)) 0 0;
  }

  .za-context-workspace__panel {
    width: 100%;
    max-width: 100%;
    max-height: calc(100dvh - max(8px, env(safe-area-inset-top)));
    border-radius: 0 0 18px 18px;
    border-left: 0;
    border-right: 0;
    border-top: 1px solid var(--za-border-subtle-variant-107,rgba(125, 211, 252, .22));
    transform: translateY(-12px);
  }

  .za-context-workspace__header {
    min-height: 58px;
    padding: 12px 14px;
    gap: 10px;
  }

  .za-context-workspace__body {
    scroll-padding-top: 16px;
    padding: 16px 14px max(18px, env(safe-area-inset-bottom));
  }

  .za-context-workspace__body:has(.za-workspace-module--dashboard) {
    padding-top: 0;
    scroll-padding-top: 0;
  }

  .za-context-workspace__body:has(.za-workspace-module--dashboard) > .za-workspace-module--dashboard {
    padding-top: 16px;
  }
}

@media (max-width: 380px) {
  .za-context-workspace__header h2 {
    font-size: 17px;
  }

}

@media (prefers-reduced-motion: reduce) {
  .za-context-workspace,
  .za-context-workspace__panel {
    transition-duration: .01ms !important;
  }
}