/* OWDEX Business R85 R3 FINAL R8 R18
 * Sidebar alinhada ao comportamento visual do OWDEX Leads 0.3.8,
 * usando a identidade azul/ciano do Business. Também mantém o tema do login compacto.
 */

:root{
  --owdex-business-blue:#0b45f5;
  --owdex-business-blue-2:#1861f1;
  --owdex-business-cyan:#0ac0fe;
  --owdex-business-active:linear-gradient(135deg,#0b45f5 0%,#1861f1 58%,#0ac0fe 100%);
  --nf-sidebar-width:288px;
  --nf-sidebar-collapsed-width:78px;
  --nd-sidebar:288px;
  --nd-sidebar-collapsed:78px;
}

/* ===== Marca do topo — mesma hierarquia do Leads: ícone + OWDEX pequeno + produto ===== */
html body.nf-redesign .sidebar .sidebar-head{
  min-height:auto!important;
  padding:3px 5px 21px!important;
  align-items:center!important;
}
html body.nf-redesign .sidebar .sidebar-logo.sidebar-logo--compact{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-width:0!important;
  padding:0!important;
  border-radius:0!important;
}
html body.nf-redesign .sidebar .sidebar-logo .sidebar-logo-badge{
  width:46px!important;
  height:46px!important;
  flex:0 0 46px!important;
  border:0!important;
  border-radius:14px!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body.nf-redesign .sidebar .sidebar-logo .sidebar-logo-icon{
  width:46px!important;
  height:46px!important;
  max-width:46px!important;
  max-height:46px!important;
  padding:0!important;
  object-fit:contain!important;
  border-radius:0!important;
  filter:drop-shadow(0 8px 17px rgba(28,73,153,.15));
}
html body.nf-redesign .sidebar .sidebar-brand-copy-r18{
  display:grid!important;
  align-content:center!important;
  gap:1px!important;
  overflow:visible!important;
  line-height:1!important;
}
html body.nf-redesign .sidebar .sidebar-brand-copy-r18 .sidebar-brand-eyebrow-r18{
  display:block!important;
  color:#65758e!important;
  font-family:Montserrat,system-ui,sans-serif!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.19em!important;
  line-height:1.1!important;
  text-transform:uppercase!important;
  -webkit-text-fill-color:currentColor!important;
}
html body.nf-redesign .sidebar .sidebar-product-name--owdex-business,
html body.nf-redesign .sidebar .sidebar-product-name--owdex-business .sidebar-brand-business{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:var(--owdex-business-blue)!important;
  background:none!important;
  font-family:Montserrat,system-ui,sans-serif!important;
  font-size:21px!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
  font-synthesis:none!important;
  letter-spacing:-.5px!important;
  line-height:1.05!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
  -webkit-text-fill-color:currentColor!important;
}
html body.nf-redesign .sidebar .sidebar-toggle{
  width:34px!important;
  min-width:34px!important;
  height:34px!important;
  min-height:34px!important;
  padding:0!important;
  display:inline-grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#61718a!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background .18s ease,color .18s ease,transform .18s ease!important;
}
html body.nf-redesign .sidebar .sidebar-toggle:hover{
  background:#f4f7fb!important;
  color:#17243c!important;
  transform:translateX(-1px)!important;
}
html body.nf-redesign .sidebar .sidebar-toggle .nf-icon{
  width:18px!important;
  height:18px!important;
  transition:transform .18s ease!important;
}

/* ===== Navegação — medidas/transições do Leads ===== */
html body.nf-redesign .sidebar .sidebar-nav{
  gap:5px!important;
}
html body.nf-redesign .sidebar .nav-section-label{
  margin:0!important;
  padding:21px 12px 8px!important;
  color:#98a3b5!important;
  font-size:10.5px!important;
  font-weight:850!important;
  letter-spacing:.14em!important;
  line-height:1.2!important;
  text-transform:uppercase!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary){
  min-height:52px!important;
  height:auto!important;
  margin:0!important;
  padding:7px 10px!important;
  border:1px solid transparent!important;
  border-radius:15px!important;
  gap:11px!important;
  color:#596983!important;
  font-size:14px!important;
  font-weight:720!important;
  box-shadow:none!important;
  transform:none;
  transition:background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary):hover{
  background:#f7f9fd!important;
  color:#17243c!important;
  transform:translateX(2px)!important;
  border-color:#edf1f6!important;
  box-shadow:none!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone] .nav-icon{
  width:36px!important;
  height:36px!important;
  flex:0 0 36px!important;
  border-radius:12px!important;
  display:grid!important;
  place-items:center!important;
  box-shadow:none!important;
  transition:background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone] .nav-icon .nf-icon{
  width:20px!important;
  height:20px!important;
  flex:0 0 20px!important;
  stroke-width:1.9!important;
  transition:transform .18s ease!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary):hover .nav-icon .nf-icon{
  transform:translateY(-1px)!important;
}

/* Cores funcionais dos ícones quando inativos — preserva a linguagem cromática do Business. */
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone]{--owdex-r18-icon:#2563eb;--owdex-r18-soft:#e8f1ff}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="blue"]{--owdex-r18-icon:#2563eb;--owdex-r18-soft:#e8f1ff}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="cyan"]{--owdex-r18-icon:#0891b2;--owdex-r18-soft:#e4f8fc}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="green"]{--owdex-r18-icon:#0b9f67;--owdex-r18-soft:#e5f8f0}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="violet"]{--owdex-r18-icon:#7c4de2;--owdex-r18-soft:#f0eaff}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="orange"]{--owdex-r18-icon:#e36b19;--owdex-r18-soft:#fff0e5}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="amber"]{--owdex-r18-icon:#c28700;--owdex-r18-soft:#fff5dc}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="red"]{--owdex-r18-icon:#e0444d;--owdex-r18-soft:#ffe9ec}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="slate"]{--owdex-r18-icon:#64748b;--owdex-r18-soft:#eef3f8}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone="indigo"]{--owdex-r18-icon:#4f5fdd;--owdex-r18-soft:#e9edff}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone] .nav-icon{
  color:var(--owdex-r18-icon)!important;
  background:var(--owdex-r18-soft)!important;
}
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone] .nav-icon :is(.nf-icon,svg){
  color:var(--owdex-r18-icon)!important;
  stroke:currentColor!important;
}

/* Selecionado — MESMO comportamento do Leads, porém com o gradiente azul/ciano do Business. */
html body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary),
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary)[data-tone]{
  color:#fff!important;
  border-color:transparent!important;
  background:var(--owdex-business-active)!important;
  box-shadow:0 13px 27px rgba(24,97,241,.24)!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary)::before{
  display:none!important;
  content:none!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary)>span:not(.nav-count):not(.nav-new){
  color:#fff!important;
  -webkit-text-fill-color:currentColor!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary)[data-tone] .nav-icon,
html[data-theme="light"] body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary)[data-tone] .nav-icon{
  color:#fff!important;
  background:rgba(255,255,255,.17)!important;
  box-shadow:none!important;
}
html body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary) .nav-icon :is(.nf-icon,svg){
  color:#fff!important;
  stroke:currentColor!important;
}
html body.nf-redesign .sidebar .sidebar-nav a.is-active :is(.nav-count,.nav-new){
  color:#0b45f5!important;
  background:#fff!important;
  border-color:rgba(255,255,255,.94)!important;
  box-shadow:0 5px 14px rgba(8,34,74,.16)!important;
}

/* ===== Recolhido — mesmo princípio do Leads: só ícones, centralizados ===== */
@media (min-width:901px){
  html body.nf-redesign .app-shell{transition:padding-left .18s ease!important}
  html body.nf-redesign .sidebar{transition:width .18s ease!important}
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar{
    padding-inline:12px!important;
    align-items:center!important;
  }
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-head{
    width:100%!important;
    justify-content:center!important;
    align-items:center!important;
    flex-direction:column!important;
    gap:8px!important;
    padding:3px 0 12px!important;
  }
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-brand-copy-r18,
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-logo-text,
  html body.nf-redesign .app-shell.sidebar-collapsed .tenant-pill-copy,
  html body.nf-redesign .app-shell.sidebar-collapsed .nav-section-label,
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-nav :is(a,.nav-more>summary)>span:not(.nav-icon):not(.nav-count):not(.nav-new){display:none!important}
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-logo{justify-content:center!important}
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-logo .sidebar-logo-badge--expanded{display:none!important}
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-logo .sidebar-logo-badge--collapsed{display:inline-flex!important}
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-toggle{margin:0 auto!important;transform:none!important}
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-toggle .nf-icon{transform:rotate(180deg)!important}
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-nav{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:7px!important;
    padding-right:0!important;
  }
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-nav :is(a,.nav-more>summary){
    width:52px!important;
    height:52px!important;
    min-height:52px!important;
    padding:0!important;
    justify-content:center!important;
    border-radius:18px!important;
  }
  html body.nf-redesign .app-shell.sidebar-collapsed .sidebar-nav :is(a,.nav-more>summary):hover{transform:translateY(-1px)!important}
}

/* ===== Tema escuro ===== */
html[data-theme="dark"] body.nf-redesign .sidebar .sidebar-brand-copy-r18 .sidebar-brand-eyebrow-r18{color:#91a0b5!important}
html[data-theme="dark"] body.nf-redesign .sidebar .sidebar-product-name--owdex-business .sidebar-brand-business{color:#79a6ff!important}
html[data-theme="dark"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary){color:#bac5d6!important}
html[data-theme="dark"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary):hover{
  background:rgba(255,255,255,.07)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.08)!important;
}
html[data-theme="dark"] body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary)[data-tone] .nav-icon{
  background:color-mix(in srgb,var(--owdex-menu-tone,#2563eb) 20%,#111827)!important;
}
html[data-theme="dark"] body.nf-redesign .sidebar .sidebar-nav :is(a.is-active,.nav-more[data-nav-current="true"]>summary){
  background:var(--owdex-business-active)!important;
  color:#fff!important;
}

/* ===== Login: botão de tema realmente compacto ===== */
html body.nd-auth-body.is-login-page .nd-auth-form-panel > .nd-auth-theme-toggle-r15{
  position:absolute!important;
  top:22px!important;
  right:24px!important;
  width:34px!important;
  min-width:34px!important;
  max-width:34px!important;
  height:34px!important;
  min-height:34px!important;
  max-height:34px!important;
  padding:0!important;
  margin:0!important;
  gap:0!important;
  display:inline-grid!important;
  place-items:center!important;
  justify-content:center!important;
  border-radius:10px!important;
  flex:0 0 34px!important;
}
html body.nd-auth-body.is-login-page .nd-auth-form-panel > .nd-auth-theme-toggle-r15 .nd-auth-theme-label-r15{display:none!important}
html body.nd-auth-body.is-login-page .nd-auth-form-panel > .nd-auth-theme-toggle-r15 :is(.nf-icon,svg){width:16px!important;height:16px!important}

@media(max-width:900px){
  html body.nf-redesign .sidebar .sidebar-nav :is(a,.nav-more>summary):hover{transform:none!important}
}
@media(max-width:720px){
  html body.nd-auth-body.is-login-page .nd-auth-form-panel > .nd-auth-theme-toggle-r15{top:14px!important;right:14px!important}
}
