/* v27g · estado da product-bar (externa) · controlado pelo cabeçalho consolidado da sidebar */

/* === Cabeçalho consolidado · ícone produto + chevron + nome === */
.sidebar-toggle-row {
  display: grid;
  grid-template-columns: 40px 22px 1fr;
  align-items: center;
  gap: 8px;
  padding: 12px 12px 12px 14px;
  border-bottom: 1px solid rgba(0,0,0,.06);
  background: linear-gradient(180deg, rgba(43,99,148,.05), transparent);
}

/* Botão ícone do produto · tinta com a cor do produto */
.sidebar-product-cycle {
  width: 40px; height: 40px;
  background: var(--p-color, #2B6394);
  border: none; border-radius: 10px;
  color: white;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
  box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.sidebar-product-cycle:hover { transform: scale(1.05); filter: brightness(1.08); }
.sidebar-product-cycle:active { transform: scale(.95); }
.sidebar-product-cycle:focus-visible {
  outline: 2px solid var(--p-color, #2B6394);
  outline-offset: 2px;
}
.sidebar-product-icon svg { width: 20px; height: 20px; color: white; }

/* Chevron botão · alterna a barra externa */
.sidebar-bar-toggle {
  width: 22px; height: 22px;
  background: transparent;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 6px;
  color: #605e5c;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s ease;
}
.sidebar-bar-toggle:hover {
  background: rgba(0,0,0,.04);
  color: #1a1a1a;
  border-color: rgba(0,0,0,.16);
}
.sidebar-bar-toggle:focus-visible {
  outline: 2px solid #2B6394;
  outline-offset: 2px;
}

/* Label do produto · nome + sub */
.sidebar-product-label { min-width: 0; }
.sidebar-product-name {
  font-size: 14px;
  font-weight: 600;
  color: #1a1a1a;
  letter-spacing: -.1px;
  line-height: 1.1;
}
.sidebar-product-sub {
  font-size: 11px;
  color: #605e5c;
  margin-top: 2px;
}

/* O ícone do produto é o ÚNICO toggle da sidebar · sempre clicável em qualquer estado */
.app-container.teams-layout .sidebar-product-cycle {
  position: relative;
  cursor: pointer;
}

/* === Quando a product-bar está oculta (authz) · só a sidebar + content ===
   !important: a regra-base do grid desktop (v27g-mobile.css, min-width:769px) também usa
   !important — sem ele aqui, ela venceria pela ordem e a coluna da barra voltaria a 68px. */
.app-container.teams-layout.product-bar-hidden {
  grid-template-columns: 0 248px 1fr !important;
}
.app-container.teams-layout.product-bar-hidden .product-bar {
  overflow: hidden;
  pointer-events: none;
  visibility: hidden;
}

/* Mobile === */
/* product-bar-hidden é AUTHZ (chrome:product-bar negado) — a barra some TAMBÉM no mobile.
   Ali ela é position:fixed (fora do grid), então display:none é seguro; a regra antiga que a
   re-exibia servia a um colapso de preferência que não existe mais neste caminho. */
@media (max-width: 768px) {
  .app-container.teams-layout.product-bar-hidden {
    grid-template-columns: none;
  }
  .app-container.teams-layout.product-bar-hidden .product-bar {
    display: none;
  }
}

/* Esconde o product-header antigo (consolidado dentro do toggle-row) */
.app-container.teams-layout .product-header { display: none; }