/* ============================================================
   SIDEBAR CLIMÁTIKO - RESPONSIVA SEM CORTAR TEXTOS
============================================================ */

.sidebar{
  width:260px !important;
  min-width:260px !important;
  box-sizing:border-box !important;
}


/*
  Remove a regra anterior que estava transformando tudo
  em grid e cortando os textos.
*/

.sidebar .nav-item,
.cc2-menu-root .nav-item,
.cc2-menu-root .cc2-group-toggle,
.cadaux-toggle,
.cadaux-filhos .nav-item{

  width:100% !important;

  min-width:0 !important;

  box-sizing:border-box !important;

  display:flex !important;

  align-items:center !important;

  gap:9px !important;

  margin:0 !important;

  overflow:visible !important;

  text-overflow:clip !important;

  white-space:nowrap !important;

}


/* GRUPOS PRINCIPAIS */

.cc2-menu-root .cc2-group-toggle{

  min-height:42px !important;

  padding:
    0
    14px
    0
    20px !important;

}


/* ITENS DOS SUBMENUS */

.cc2-submenu > .nav-item{

  min-height:38px !important;

  padding:
    0
    14px
    0
    48px !important;

}


/* OPÇÕES AUXILIARES */

.cadaux-toggle{

  min-height:38px !important;

  padding:
    0
    14px
    0
    48px !important;

}


.cadaux-filhos .nav-item{

  min-height:37px !important;

  padding:
    0
    12px
    0
    58px !important;

}


/* ÍCONE */

.cc2-group-toggle > :first-child,
.cc2-submenu .nav-item > :first-child,
.cadaux-toggle > :first-child,
.cadaux-filhos .nav-item > :first-child{

  flex:
    0
    0
    18px !important;

  width:18px !important;

  min-width:18px !important;

  margin:0 !important;

  text-align:center !important;

}


/* TEXTO */

.cc2-group-toggle span:not(.cc2-arrow),
.cc2-submenu .nav-item span:not(.cc2-arrow),
.cadaux-toggle span:not(.cadaux-arrow),
.cadaux-filhos .nav-item span{

  min-width:0 !important;

  flex:1 1 auto !important;

  white-space:nowrap !important;

  overflow:visible !important;

  text-overflow:clip !important;

}


/* SETA SEM EMPURRAR O TEXTO */

.cc2-arrow,
.cadaux-arrow{

  flex:
    0
    0
    14px !important;

  width:14px !important;

  margin-left:auto !important;

  text-align:center !important;

}


/* ============================================================
   NOTEBOOK
============================================================ */

@media(max-width:1200px){

  .sidebar{

    width:250px !important;

    min-width:250px !important;

  }


  .cc2-menu-root .cc2-group-toggle{

    padding-left:16px !important;

  }


  .cc2-submenu > .nav-item{

    padding-left:40px !important;

  }


  .cadaux-toggle{

    padding-left:40px !important;

  }


  .cadaux-filhos .nav-item{

    padding-left:50px !important;

  }

}


/* ============================================================
   TELAS MAIS ESTREITAS
============================================================ */

@media(max-width:850px){

  /*
    Não comprime para 220px como antes.
    Mantém largura suficiente para os textos.
  */

  .sidebar{

    width:245px !important;

    min-width:245px !important;

  }


  .sidebar .nav-item,
  .cc2-menu-root .nav-item,
  .cc2-menu-root .cc2-group-toggle{

    font-size:11px !important;

  }

}