/* Desktop compacto. O mobile mantém seu menu e cabeçalho próprios. */
.spot-message-bell { display: none; }
@media (min-width: 769px) {
  body { background: #EEF0F1; }
  body .side-nav {
    width: 64px; padding: 100px 13px; gap: 20px;
    background: transparent; overflow: visible; transition: width .2s ease;
  }
  body .side-nav:hover { width: 260px; }
  .side-nav::before {
    content: ''; position: absolute; left: 8px; width: calc(100% - 16px);
    top: var(--spot-tray-top, calc(50% - 111px));
    height: var(--spot-tray-height, 222px);
    border-radius: 14px; background: #dfe1e2; pointer-events: none;
  }
  body .side-nav > .nav-opt,
  body .side-nav > .nav-item-group,
  body .side-nav > .spot-nav-more { width: 38px; min-width: 38px; position: relative; }
  .side-nav:not(:hover) > .nav-opt > span,
  .side-nav:not(:hover) > .nav-item-group > .nav-opt > span,
  .side-nav:not(:hover) > .nav-item-group > .nav-opt > .chevron,
  .side-nav:not(:hover) > .spot-nav-more > button > span:not(.icon-box) { display: none !important; }
  .side-nav > .nav-item-group > .nav-opt { width: 38px; }
  .side-nav > .nav-item-group > .nav-submenu.open {
    position: fixed; left: 72px; top: 35vh; width: 230px; max-height: 55vh;
    overflow: auto; padding: 12px; background: #EEF0F1;
    border: 1px solid #d4d6d7; border-radius: 14px;
    box-shadow: 0 12px 30px #0002; z-index: 10050;
  }
  .side-nav > .nav-item-group > .nav-submenu.open span { opacity: 1; }
  body .side-nav .side-brand, body .side-nav:hover .side-brand {
    left: 32px; top: 24px; width: 42px; height: 42px;
  }
  body .side-nav > .side-bottom-tools,
  body .side-nav:hover > .side-bottom-tools {
    left: 8px !important; right: auto !important; bottom: 4px !important;
    width: 48px !important; padding: 6px 5px !important;
    gap: 12px !important; background: #dfe1e2; border-radius: 14px;
  }
  body .side-nav:not(:hover) .side-bottom-tools .side-tool-nav > span:not(.side-tool-icon):not(.icon-box) { display: none !important; }
  body .side-nav > .side-bottom-tools .side-tool-icon { background: #fff !important; }
  body .header { height: 96px; min-height: 96px; padding: 20px 42px 20px 27px; }
  body .header .ai-command-container {
    left: 27px; top: 21px; transform: none;
    width: min(380px, calc(100% - 280px)); max-width: 380px;
  }
  body .header .user-profile-wrapper {
    border: 0;
    padding: 7px 9px;
    gap: 12px;
    border-radius: 17px;
    background: #dfe1e2;
    height: 52px;
    min-height: 52px;
    max-height: 52px;
    box-sizing: border-box;
    align-items: center;
  }
  body .header .user-info { align-items: flex-start; }
  .spot-message-bell {
    position: relative; display: grid; place-items: center; flex: 0 0 38px;
    width: 38px; height: 38px; min-width: 38px; min-height: 38px; max-width: 38px; max-height: 38px;
    border: 0; border-radius: 12px;
    background: #fff; color: #171717; cursor: pointer;
    padding: 0; margin: 0; box-sizing: border-box;
    transform: none !important;
  }
  .spot-message-bell svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .spot-message-bell[aria-expanded="true"] { background: #171717; color: #fff; }
  .spot-message-bell:focus-visible { outline: 2px solid #171717; outline-offset: 3px; }
  .spot-message-bell.has-unread::after {
    content: ''; position: absolute; right: 3px; top: 3px;
    width: 8px; height: 8px; border-radius: 50%; background: #171717; border: 2px solid #dfe1e2;
  }
  body .content-area { padding-bottom: 24px; }
  body .main-hero-title { font-size: clamp(42px, 5.5vw, 104px); }
  body .main-wrapper:has(> .floating-window.active:not(.is-minimized)) > .header .ai-command-container,
  body .main-wrapper:has(> #spot-chat-shell.open:not([hidden])) > .header .ai-command-container {
    left: 100px; width: min(380px, calc(100% - 353px));
  }

  body .side-nav:hover > .nav-opt,
  body .side-nav:hover > .nav-item-group,
  body .side-nav:hover > .spot-nav-more,
  body .side-nav:hover > .nav-item-group > .nav-opt,
  body .side-nav:hover .spot-nav-more-button { width: 234px; }
  body .side-nav:hover > .side-bottom-tools { width: 244px !important; }
  body .side-nav:hover .side-tool-label { display: block !important; }
  body .side-nav:hover > .nav-item-group > .nav-submenu.open { left: 268px; }
  body .side-nav > .nav-opt .icon-box,
  body .side-nav > .nav-item-group > .nav-opt .icon-box,
  body .side-nav .spot-nav-more-button .icon-box { background: #fff; flex: 0 0 38px; }
  body .side-nav > .nav-opt.current-page,
  body .side-nav > .nav-opt.current-section,
  body .side-nav > .nav-item-group > .nav-opt.current-page,
  body .side-nav > .nav-item-group > .nav-opt.current-section,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-page,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-section { background: transparent !important; }
  body .side-nav .nav-opt.current-page > span:not(.icon-box),
  body .side-nav .nav-opt.current-section > span:not(.icon-box) { color: #171717 !important; }
  body .side-nav .nav-opt.current-page .icon-box,
  body .side-nav .nav-opt.current-section .icon-box,
  body .side-nav .spot-nav-more-button.spot-more-open .icon-box,
  body .side-nav .spot-nav-more-button.current-section .icon-box,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-page .side-tool-icon,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-section .side-tool-icon {
    background: #171717 !important; color: #fff !important; border-color: #171717 !important;
  }
}

/* Caixas lisas, sem o contorno escuro herdado da navegação antiga. */
@media (min-width: 769px) {
  body .side-nav .nav-opt .icon-box,
  body .side-nav .spot-nav-more-button .icon-box,
  body .side-nav > .side-bottom-tools .side-tool-nav .side-tool-icon {
    border-width: 0 !important;
    box-shadow: none !important;
  }
}

.spot-notifications-dropdown[hidden], .spot-notifications-dropdown [hidden] { display: none !important; }
.spot-notifications-dropdown {
  position: absolute; top: calc(100% + 12px); right: 0; z-index: 10060;
  width: min(340px, calc(100vw - 32px)); padding: 18px;
  background: #fff; color: #171717; border: 1px solid #e4e6e7;
  border-radius: 18px; box-shadow: 0 14px 40px #00000018;
  text-align: left;
}
.spot-notifications-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 15px; }
.spot-notifications-head button { width: 30px; height: 30px; border: 0; border-radius: 9px; background: #EEF0F1; color: #171717; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; position: relative; flex: 0 0 30px; }
.spot-notifications-close::before,
.spot-notifications-close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 1.7px;
  border-radius: 999px;
  background: currentColor;
  transform-origin: center;
}
.spot-notifications-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.spot-notifications-close::after  { transform: translate(-50%, -50%) rotate(-45deg); }
.spot-notifications-summary { margin: 18px 0 8px; color: #62666a; font-size: 13px; line-height: 1.6; }
.spot-notifications-messages { width: 100%; margin-top: 12px; padding: 12px; border: 0; border-radius: 10px; background: #EEF0F1; color: #171717; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.spot-notifications-dropdown button:focus-visible { outline: 2px solid #171717; outline-offset: 3px; }

/* Rótulos brancos nos blocos da navegação lateral. */
@media (min-width: 769px) {
  body .side-nav:hover > .nav-opt > span:not(.icon-box),
  body .side-nav:hover > .nav-item-group > .nav-opt > span:not(.icon-box),
  body .side-nav:hover > .spot-nav-more > .spot-nav-more-button > span:not(.icon-box),
  body .side-nav:hover > .side-bottom-tools .side-tool-nav > .side-tool-label {
    color: #8B8B8B !important;
  }
}

/* O texto acompanha o destaque do item ativo. */
@media (min-width: 769px) {
  body .side-nav:hover > .nav-opt:is(.current-page, .current-section) > span:not(.icon-box),
  body .side-nav:hover > .nav-item-group > .nav-opt:is(.current-page, .current-section) > span:not(.icon-box),
  body .side-nav:hover > .spot-nav-more > .spot-nav-more-button:is(.spot-more-open, .current-page, .current-section) > span:not(.icon-box),
  body .side-nav:hover > .side-bottom-tools .side-tool-nav:is(.current-page, .current-section) > .side-tool-label {
    color: #171717 !important;
  }
}


/* Voltar — medidas copiadas da referência enviada pelo usuário. */
@media (min-width: 769px) {
  body .main-wrapper:has(> .floating-window.active:not(.is-minimized)) > .header > .spot-module-navigation,
  body .main-wrapper:has(> #spot-chat-shell.open:not([hidden])) > .header > .spot-module-navigation {
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: 82px !important;
    height: 56px !important;
    padding: 9px 0 9px 13px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: #dfe1e2 !important;
    box-shadow: none !important;
    transform: translateY(-50%) !important;
    z-index: 10020 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  body .header > .spot-module-navigation .spot-module-back {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #000 !important;
    box-shadow: none !important;
    cursor: pointer;
  }

  /* O SVG precisa ser maior que 20px porque o desenho possui margem no viewBox. */
  body .header > .spot-module-navigation .spot-module-back svg {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    display: block !important;
    fill: none !important;
    stroke: #000 !important;
    stroke-width: 2.35 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  body .header > .spot-module-navigation .spot-module-back:hover {
    background: #fff !important;
    color: #000 !important;
  }
}


/* S.P.O.T. aberto em modo robô: mantém a caixa compacta e evita que
   coordenadas de arraste estiquem o painel pela altura da tela. */
@media (min-width: 769px) {
  body .header .ai-command-container.spot-mode-bubble.bubble-open {
    position: fixed !important;
    top: auto !important;
    left: auto !important;
    right: 18px !important;
    bottom: 30px !important;
    width: min(430px, calc(100vw - 60px)) !important;
    min-width: 0 !important;
    max-width: 430px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: min(70vh, 560px) !important;
    padding: 14px !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  body .header .ai-command-container.spot-mode-bubble.bubble-open .search-bar {
    flex: 0 0 auto !important;
    width: 100% !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    box-sizing: border-box !important;
  }

  body .header .ai-command-container.spot-mode-bubble.bubble-open .ai-response-box {
    flex: 0 1 auto !important;
    max-height: calc(70vh - 92px) !important;
    overflow: auto !important;
  }
}

@media (max-width: 768px) {
  body .header .ai-command-container.spot-mode-bubble.bubble-open {
    top: 76px !important;
    left: auto !important;
    right: 12px !important;
    bottom: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 92px) !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  body .header .ai-command-container.spot-mode-bubble.bubble-open .search-bar {
    flex: 0 0 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
  }
}


/* v48: textos claros usam #8B8B8B, mas ícones permanecem brancos. */
@media (min-width: 769px) {
  body .side-nav .nav-opt.current-page .icon-box,
  body .side-nav .nav-opt.current-section .icon-box,
  body .side-nav .spot-nav-more-button.spot-more-open .icon-box,
  body .side-nav .spot-nav-more-button.current-section .icon-box,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-page .side-tool-icon,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-section .side-tool-icon {
    color:#fff !important;
  }
  body .side-nav .nav-opt.current-page .icon-box svg,
  body .side-nav .nav-opt.current-section .icon-box svg,
  body .side-nav .spot-nav-more-button.spot-more-open .icon-box svg,
  body .side-nav .spot-nav-more-button.current-section .icon-box svg,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-page .side-tool-icon svg,
  body .side-nav > .side-bottom-tools .side-tool-nav.current-section .side-tool-icon svg {
    color:#fff !important;
    stroke:#fff !important;
  }
  body .side-nav .nav-opt.current-page .icon-box svg.spot-catalog-icon,
  body .side-nav .nav-opt.current-section .icon-box svg.spot-catalog-icon,
  body .side-nav .spot-nav-more-button.spot-more-open .icon-box svg.spot-catalog-icon,
  body .side-nav .spot-nav-more-button.current-section .icon-box svg.spot-catalog-icon {
    fill:#fff !important;
    stroke:none !important;
  }
}