/* Chat do lojista: botão de envio roxo e sempre visível no mobile. */
html body[data-app-variant="seller"] #overlay .support-chat-load-older {
  display: block !important;
  width: 100% !important;
  min-height: 40px !important;
  margin: 8px auto 12px !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: rgb(255 255 255 / 84%) !important;
  color: #6d28d9 !important;
  font: inherit !important;
  font-size: 12px !important;
  text-align: center !important;
}

html body[data-app-variant="seller"] #overlay .support-chat-load-older:disabled {
  opacity: .7 !important;
}

html body[data-device="mobile"][data-app-variant="seller"]
  #overlay#overlay#overlay.overlay:has(.support-chat-shell)
  #supportChatSendBtn#supportChatSendBtn#supportChatSendBtn {
  display: inline-flex !important;
  position: relative !important;
  z-index: 2 !important;
  pointer-events: auto !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #fff !important;
  background: #7c3aed !important;
  background-color: #7c3aed !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: none !important;
}

html body[data-device="mobile"][data-app-variant="seller"]
  #overlay#overlay#overlay.overlay:has(.support-chat-shell)
  #supportChatSendBtn#supportChatSendBtn#supportChatSendBtn svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body[data-device="mobile"][data-app-variant="seller"]
  #overlay#overlay#overlay.overlay:has(.support-chat-shell)
  #supportChatForm {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
}

html body[data-device="mobile"][data-app-variant="seller"]
  #overlay#overlay#overlay.overlay:has(.support-chat-shell)
  #supportChatInput {
  flex: 1 1 0% !important;
  width: auto !important;
  min-width: 0 !important;
}

/* Menu hamburguer: sem o filtro vermelho no hover; ícone roxo. */
@media (max-width: 760px) {
  

  

  
}

/* Somente a tela de login recebe o fundo lilás fixo; a arte/blur é removida. */
@media (max-width: 760px) {
  html body[data-device="mobile"][data-app-variant="seller"]:has(.seller-access-stage),
  html body[data-device="mobile"][data-app-variant="seller"]:has(.seller-access-gate),
  html body[data-device="mobile"][data-app-variant="seller"] #main:has(.seller-access-stage),
  html body[data-device="mobile"][data-app-variant="seller"] #main:has(.seller-access-gate),
  html body[data-device="mobile"][data-app-variant="seller"] .seller-access-stage {
    background-color: #f4eeff !important;
    background-image: none !important;
  }

  html body[data-device="mobile"][data-app-variant="seller"] .seller-access-stage::before,
  html body[data-device="mobile"][data-app-variant="seller"] .seller-access-stage::after {
    content: "" !important;
    display: block !important;
    position: fixed !important;
    z-index: -1 !important;
    pointer-events: none !important;
    filter: none !important;
  }

  html body[data-device="mobile"][data-app-variant="seller"] .seller-access-stage::before {
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    border-radius: 0 !important;
    background-color: #f4eeff !important;
    background-image: url("../media/login-side-blobs-gpt.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 100% 100% !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body[data-device="mobile"][data-app-variant="seller"] .seller-access-stage::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }

  html body[data-device="mobile"][data-app-variant="seller"] {
    --ui-bg: #f4eeff !important;
  }
}

html body[data-app-variant="seller"] #overlay.overlay:has(.support-chat-shell) #supportChatMessages {
  background-color: #efeae2 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg fill='none' stroke='%238d8378' stroke-opacity='.14' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 27h29a7 7 0 0 1 7 7v12a7 7 0 0 1-7 7H34l-9 7v-7h-7a7 7 0 0 1-7-7V34a7 7 0 0 1 7-7z'/%3E%3Cpath d='m112 22 2.4 6.1 6.6.5-5 4.3 1.6 6.4-5.6-3.5-5.6 3.5 1.6-6.4-5-4.3 6.6-.5z'/%3E%3Cpath d='M124 92c-6-7-17 1-9 9l9 9 9-9c8-8-3-16-9-9z'/%3E%3Ccircle cx='37' cy='120' r='11'/%3E%3Cpath d='M31 120h12M37 114v12M91 145c5-8 12-8 17 0m-8-8v16'/%3E%3Cpath d='M146 42h18a5 5 0 0 1 5 5v8a5 5 0 0 1-5 5h-7l-6 5v-5h-5a5 5 0 0 1-5-5v-8a5 5 0 0 1 5-5z'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-repeat: repeat !important;
  background-size: 180px 180px !important;
}


/* Relatórios mobile: centralizar apenas os valores dos dois primeiros KPIs. */
@media (max-width: 760px) {
  html body[data-device="mobile"][data-app-variant="seller"] #main .reports-page .report-kpis > .report-kpi:nth-child(-n + 2) > .report-kpi-value {
    align-self: stretch !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
  }
}