/* MENU EXTERNO OPEN/CLOSE */
#sidebarplus, #sidebartrans, #sidebargoverno, #sidebarsecretarias {transform: translateX(-100%); transition: transform 0.8s ease; overflow-y: auto; display: block}
#sidebarplus.active, #sidebartrans.active, #sidebargoverno.active, #sidebarsecretarias.active {transform: translateX(0)}
.sidebarmenu-button        	{display:flex; flex-direction:row; gap:4px; justify-content:flex-end}
.sidebarmenu-button a      	{background:var(--hmenubkg); color:var(--hmenufont); padding:10px 10px; border-radius:10px; font-size: 16px; display: flex; align-items:center; cursor:pointer}
.sidebarmenu-button a:hover {background:var(--hmenuhov)}
.sidebarmenu-button .active {background:var(--hmenuhov)}
.sidebarmenu-button a i    	{font-size:17px; color:var(--hmenufont); align-items: center; margin-right:5px; width:15px; height:20px}
.sidebarmenu-button h1     	{font: 400 14px/14px "Roboto", sans-serif; color:var(--hmenufont); margin-top: 2px; letter-spacing:0.5px}
@media (max-width: 450px){.sidebarmenu-button a i{display: none}.sidebarmenu-button h1{font: 700 12px/12px "Roboto", sans-serif; color:var(--hmenufont); margin-top: 2px; }}
@media (max-width: 835px){.sidebarmenu-button h1{font: 700 12px/12px "Roboto", sans-serif; color:var(--hmenufont); margin-top: 2px; }}

/* SCROL DO ASIDEBAR */
.sidebarplus::-webkit-scrollbar {width: 8px}
.sidebarplus::-webkit-scrollbar-track {background-color:var(--sibarscrolbkg)}
.sidebarplus::-webkit-scrollbar-thumb {background-color:var(--sibarscrolmov); border-radius: 10px;}
.sidebarplus::-webkit-scrollbar-thumb:hover {background-color:var(--sibarscrolhov)}

/* CONTAINER E CONTEUDO DO SIDEBAR (ABA) */
.sidebarplus               	{background: var(--sidebarbkg); padding:20px; width: 350px; top: 0; left: 0; height: 100vh; position: fixed; z-index: 999; overflow-y: scroll; -ms-overflow-style: scrollbar; scrollbar-gutter: stable;}
.sidebarplus-header        	{color: var(--sibarfont); font: 700 20px/15px "Roboto"; margin-top:15px; padding:0 15px; border-bottom: 1px dotted var(--sibarbot); display: flex; justify-content: space-between; align-items: center; line-height:2}
.sidebarplus .close-btn    	{background: none; border: none; color:var(--sibarfont); font-size: 20px; cursor: pointer}
@media (max-width: 500px) 	{.sidebarplus {width:100%}}
.sidebarplus-button a      	{background-color:var(--sibarbut); color:var(--sibarbutfont); border:1px solid var(--sibarbutbor); font: 700 15px/20px "Roboto"; padding: 10px 20px; border-radius:20px; cursor: pointer; transition: background-color 0.3s ease}
.sidebarplus-button a:hover {background-color:var(--sibarbuthov)}

/* ASIDE PLUS */
.asidebarplus .row          {background-color: var(--asidebarplus); margin-bottom:5px; padding: 5px; display: flex; align-items: center; border-bottom: 1px dotted var(--asibarplusbot); cursor: pointer}
.asidebarplus .row:hover    {background-color: var(--asibarplushov)}
.asidebarplus .icon         {font-size: 20px; color: var(--asibarplusfont); margin: 0 10px}
.asidebarplus .text         {padding:7px;}
.asidebarplus .title        {font: 600 15px/20px "Montserrat"; color: var(--asibarplusfont); text-transform: uppercase}
.asidebarplus .sub          {font: 400 13px/17px "Roboto"; color: var(--asibarplusfont)}
.asidebarplus .ttaplus      {background: var(--asibarplustta); font: 600 15px/20px "Roboto"; color: var(--asibarplusfont); border-bottom:1px solid var(--asidebarpluisbot); margin-bottom:10px; margin-top:10px; padding:12px; text-transform: uppercase;}
.asidebarplus .ttaplus:before {content: "\f013"; font-family: FontAwesome; margin-right:10px}

/* ACCORDION */
.accordion-title    		{background-color: var(--asibaraccortta); color: var(--asibarcolfont); font: 700 14px/14px "Roboto"; cursor: pointer; padding:15px; border-bottom: 1px dotted var(--asibarbot); margin-bottom: 5px; display: flex; justify-content: space-between; align-items: center}
.accordion-content  		{max-height: 0; overflow: hidden; transition: max-height 0.5s ease}
.accordion-content a 		{background-color: var(--asidebaraccor); color: var(--asibarcolfont); border: 1px solid var(--asibaraccorbor); font: 700 13px / 17px "Roboto", sans-serif; width: 60%; padding: 7px 8px; display: block; transition: background-color 0.3s; border-radius: 15px; letter-spacing: 1px;}
.accordion-content a:hover	{background-color: var(--asibaraccorhov)}
.accordion-content a:before {content: "\f061"; font-family: FontAwesome; margin-right:10px; position: relative; left: 0; transition: left 0.3s ease}
.accordion-content.open 	{max-height: 400px}
.accordion-tta      		{background: var(--asibaraccortta); font: 600 15px/20px "Roboto"; color: var(--asibaraccorfont); padding:20px 15px; text-transform: uppercase;}
.accordion-tta:before  		{content: "\f013"; font-family: FontAwesome; margin-right:10px}
.accordion-line     		{margin:10px 0; border: 1px dotted var(--asibarline)}

/* SIDEBARCOL */
.asidebarcol a      		{background: var(--asidebarcol); font: 400 13px/17px "roboto", sans-serif; color:var(--asibarcolfont); padding: 8px 20px; border-bottom: dotted 1px var(--asibarcolbot); display:block; align-items: center; overflow: hidden}
.asidebarcol a::before 		{content: "\f0da"; font-family: FontAwesome; margin-right: 10px; position: relative; left: 0; transition: left 0.3s ease}
.asidebarcol a:hover        {background: var(--asibarcolhov)}
.asidebarcol-tta    		{background: var(--asibarcoltta); font: 600 15px/20px "Roboto"; color: var(--asibarcolfontta); margin-bottom:10px; margin-top:10px; border-bottom:0px solid var(--asibarbot); padding:12px; text-transform: uppercase;}

/* TRANS ARQUIVOS */
.asidetrans a      			{background: var(--asidetrans); font: 400 13px/17px "roboto", sans-serif; color:var(--asidetransfont); padding: 8px 20px; border-bottom: dotted 0px var(--asidetransbot); display:block; align-items: center; overflow: hidden}
.asidetrans a::before 		{content: "\f061"; font-family: FontAwesome; margin-right: 10px; position: relative; left: 0; transition: left 0.3s ease}
.asidetrans a:hover        	{background: var(--asidetranshov)}
.asidetrans-tta    			{background: var(--asidetranstta); font: 600 15px/20px "Roboto"; color: var(--asidetransfont); margin-bottom:0px; margin-top:25px; border-bottom:0px solid var(--asidetransbot); padding:13px 12px; text-transform: uppercase;}
