:root {
  /* Primary colors */
  --primary: #162767;
  --primary-light: #2a3d7d;
  --primary-dark: #0a1a4a;
  
  /* Secondary colors */
  --secondary: #019FDE;
  --secondary-light: #33b3e5;
  --secondary-dark: #0180b4;
  
  /* Neutrals */
  --light-gray: #f8f9fa;
  --mid-gray: #aaa;
  --gray: #6c757d;
  --dark-gray: #535353;
  --darker-gray: #343a40;
  
  /* UI colors */
  --success: #28a745;
  --warning: #ffc107;
  --danger: #dc3545;
  --info: #17a2b8;
  
  /* Background colors */
  --bg-light: #ffffff;
  --bg-card: #ffffff;
  --bg-gray: #f8f9fa;
  --bg-input: #ffffff;
  
  /* Border colors */
  --border-light: rgba(170, 170, 170, 0.3);
  --border-medium: rgba(170, 170, 170, 0.5);
  --border-dark: rgba(170, 170, 170, 0.7);
  
  /* Text colors */
  --text-primary: #040815;
  --text-secondary: #535353;
  --text-muted: #6c757d;
  --text-light: #ffffff;
  
  /* Status colors */
  --status-critical: #dc3545;
  --status-warning: #ffc107;
  --status-attention: #fd7e14;
  --status-monitor: #17a2b8;
  --status-complete: #28a745;
  
  /* Shadows */
  --shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --shadow-lg: -4px 4px 10px rgba(0, 0, 0, 0.2);
  
  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-xxl: 3rem;
  
  /* Border radius */
  --border-radius-sm: 0.25rem;
  --border-radius: 0.5rem;
  --border-radius-lg: 0.75rem;
  
  /* Typography */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 2rem;
  --font-size-4xl: 2.5rem;
  
  /* Sidebar variables */
  --sidebar-width: 280px;
  --sidebar-collapsed-width: 80px;

  /* Z-index layers */
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-tooltip: 1070;
}

#telaprincipal{
	margin: 1%  15% 0px 5px;
}

#imagem_menu {
	width: 900px;
	height: 70px;
	top: -10px;
	margin: 0 auto;
	font-family: "Inter";
	background: url(img01.jpg) no-repeat left top;
}

#opcaohome {
	width: 50px;
	top: -50px;
	left:320px;
    font-size: 0.97em;
    font-family: 'Inter', Helvetica, sans-serif;
}


#margem{
	position:relative;
	top:0px;
	left:40px;
}

#contaatual{
    position:relative;
    width: 210px;
	height: 10px;
	left:710px;	
	top:-25px;
}

#selecionaconta{
    position:relative;
    width: 10px;
	height: 10px;
	left:655px;	
	top:-120px;
}


#margemmenuconta{
	top:0px;
	left:60px;
}

#titulo_manter_usuario{
	position:relative; 
    font-family: Inter;
	font-size: 20px;
    z-index:0;
	color:white;
	background: url(img01.jpg) no-repeat center;	
	padding-left: 10px;
}
#titulo_manter_usuario1 {
position:relative; 
top:4px; 
color:black;	
background: url(img01.jpg) no-repeat left top;
}

#printpage .oks{
    height:3px;
    border: 0;
    background-color: #7577c2;
    display: block;
}

#printpage .oka{
    height:3px;
    border: 0;
    background-color: #00a3a2;
    display: block;
}

#printpage LEGEND.lgd{
    font-family: 'Inter', Helvetica, sans-serif;
    font: bold;
    font-size: 1.1em;
	color: #000000;
}


#printpage table{
    font: normal 1em;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #000000;
}


#printpage td.ctd{
    font-size: 1.1em;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage td.ctdok{
    height:3px;
}

#printpage tr.ctra{
    background-color:#00a3a2;
    line-height:20px;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage tr.ctrs{
    line-height:20px;
    background-color:#7577c2;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage tr.ctrtg{
    line-height:20px;
    background-color:#eb7746;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
	border-color: #eb7746;
}

#printpage td.ctdts{
    line-height:20px;
    font-family: 'Inter', Helvetica, sans-serif;
	background-color:#7577c2;
	color:  #FFFFFF;
	font: bold 0.9em;
}

#printpage td.ctds{
    line-height:20px;
    background-color:#7577c2;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage td.ctdta{
    line-height:20px;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #00a3a2;
	font: bold 0.9em;
}

#page FIELDSET{
	font-family: "Inter", Arial, Helvetica, sans-serif;
	color: #8080FF;
	font:nomal 1em;

}


h1, h2, h3 {
	margin: 0;
	font-family: Inter, "Inter", Times, serif;
	font-weight: normal;
	color: #649632;
	font: bold;
}

h1 { font-size: 44px; }

h2 {
     font-size: 15px;
     font: bold;
     }

h3 {

}

p, ul, ol {
	margin-top: 0;
	line-height: 240%;
	text-align: justify;
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-size: 11px;
}

ul, ol { }

blockquote { }

a { color: #000000; }

a:hover { text-decoration: none; }

a img {
	border: none;
}

img.left {
	float: left;
	margin: 7px 30px 0 0;
}

img.right {
	float: right;
	margin: 7px 0 0 30px;
}

hr { display: none; }

.list1 {
}

.list1 li {
	float: left;
	line-height: normal;
}

.list1 li img {
	margin: 0 30px 30px 0;
}

.list1 li.alt img {
	margin-right: 0;
}

#wrapper {
}


/* Header */

#header-wrapper {
	width: 880px;
	height: 30px;
	margin: 0 auto;
}

#header {
	width: 900px;
	height: 30px;
	margin: 0 auto;

}

/* Menu */

#menu {
	float: left;
	width: 900px;
	height: 30px;

}

#menu h1{
	margin: 10px  0 0 0px;
	padding: 0 0 0px 0;
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font: bold;
	color: #FFFFFF;
}

.botao{
    border: solid 1px blue;
    border-radius: 20px;
    color: blue;
    background-color: white;
	font-family: Inter;
	font-size: 13px;
    transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease;
}
.botao:hover{
    background-color: blue;
    color: white;
    transform: scale(1.1)
}

/* Page */

#page {
	width: 900px;
	margin: 0 auto;
	padding: 15px 0px 0px 0px;
	z-index:3;
    background-color: #FFFFFF
}

#printpage_old {
	width: 70%;
	margin: 0 auto;
	padding: 10px 0px 0px 0px;
    font-family: Inter;
	font-size: 13px;
}

#printpage {
    body, html {
        margin: 0;
        padding: 0;
        height: 100%;
    }
	flex: 1;
	width:100%;
	/* padding: 20px; */
	/* margin-left: var(--sidebar-width); */
	margin-top: 0px;
	margin-bottom: 0px;
	font-family: Inter;	 	

/*	position:relative;
	width:950px;
	min-width:00px;
	margin-left:240px;		
	
	border-bottom:none;
	
	padding:8px;
	overflow:auto;
*/
}

#printpage_2 {
	position: relative;
	padding: 15px 0px 0px 0px;	
	left:-100;
	/*height: 100%;*/
	width: 998px;  /*comprimento horizontal */
    font-family: Inter;
	font-size: 15px;
		
}

#label_fontcenturygotic {
	padding: 15px 0px 0px 00px;
    font-family: Inter;
	font-size: 13px;
}
#campo_fontcenturygotic {
	padding: 4px 0px 0px 00px;
    font-family: Inter;
	font-size: 13px;
}

label{
    font-family: Inter;
	font-size: 13px;
}

#printpage_3 {
	width:950px;
	min-width:00px;
	margin-left:240px;		
	border-bottom:none;
	position:relative;
	padding:8px;
	overflow:auto;
	
	font-family: Roboto,Calibri;
}


#printdashbox {
	padding: 0px 0px 0px 180px;	
}


#printpage_solicitacao {
    overflow:scroll;
    width: 900px; 
    height: 205px; 
 
}


#page2 {
	width: 900px;
	margin: 0 auto;
	padding: 60px 0px 0px 0px;
}

/** LOGO*/

#logo {
	margin-top: 24px;
	margin-bottom: 25px;

	padding: 20px;

	width: 100%;
	/* height: 91px; */
    font-family: Inter;
	font-size: 13px;
	color: var(--text-primary);
	background-color: #FFFFFF;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);

	border-radius: 8px;

	display: flex;
	justify-content: center;
	align-items: center;

	/* background: url(img03_new.jpg); */
	/* background-repeat: no-repeat;  */
/*	width: 900px;
	height: 85px;
	margin: 0 auto;
	padding: 10px 0px 0px 0px;
	font-family: "Inter";
	background: url(img03_new.jpg);*/
}

#barra_statusprioridade_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #FF0000;
}
#barra_statusnovo_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #FFA500;
}
#barra_statusretornocli_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #3CB371;
}

#barra_statusemadamento_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #FFD700;
}
#barra_statusaguardandocliente_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #6959CD;
}
#barra_statusaguardandoterceiro_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #1c49a4;
}
#barra_statusavalicaofinal_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #1c49a4;
}
#barra_statuspendentecobranca_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #3CB371;
}


#barra_vermelho_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #FF0000;
}
#barra_laranja_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #FF8C00;
}
#barra_verde_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #32CD32;
}
#barra_azul_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #0000CD;
}
#barra_azul1_guia {
	height: 25px;
	margin: -13px  0px 0px -12px;
	float: top;
	width: 102%;
	margin-bottom: 00px;
    font-family: Inter;
	font-size: 16px;
	text-align: center;
	color: white;
	font-weight: bold; 
	background: #6959CD;
}

#menu_inf {
	width: 900px;
	height: 30px;
	margin: 0 auto;
	background: url(img07.jpg) no-repeat left top;
}

#menu_inf li {
	display: block;
	float: left;
	margin-right: 5px;
	padding: 2px 20px 10px 28px;
	background: url(img06.gif) no-repeat;
	text-decoration: none;
	font: 10px Inter, "Tahoma", Times, serif;
	color: #FFFFFF;
	}

#logo h1, #logo p {
	margin: 0;
	padding: 0 0 0 220px;
	line-height: normal;
}

#logo h1 a:hover { text-decoration: underline; }

#logo p {
	padding: 130px 0px 0px 0px;
	font: italic 13px Inter, 'Inter', Times, serif;
	color: #000000;
}

#logo p a {
	color: #000000;
}

#logo p a:hover { text-decoration: underline; }

/* Content */

#content {
	float: right;
	width: 600px;

}

#cab_saudacao {
	/* margin: -0px  0 3px 25px; */
	padding: 2px 30px 2px 0px;
	font-family: 'Inter','Inter', Helvetica, sans-serif;
	font-weight: bold;
	font-size: 20px;
	/* color: white; */

}

#cab_empresa {
	/* margin: 0px  0 3px 10px; */
	font-family: 'Inter','Inter', Helvetica, sans-serif;
	font-weight: bold;
	font-size: 25px;
	/* color: white; */

}

#cab_login {
	/* margin: -65px  0 3px 550px; */
	font-family: 'Inter','Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 15px;
	/* color: white; */

}

#cab_perfil {
	/* margin: 5px  0 3px 550px; */
	font-family: 'Inter','Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 15px;
	/* color: white; */

}



/* Post */

.post {
	margin-bottom: 15px;
}

.post .title {
	height: 30px;
	margin-bottom: 3px;
	padding: 8px 0px 2px 40px;
	background: url(img05.jpg) no-repeat left top;
	color: #000000;
	font: bold;
}

.post .titulo {
	height: 1px;
	margin-bottom: 3px;
	padding: 8px 0px 3px 0px;
	/*background: url(images/img10.jpg) no-repeat left top; */
	color: #000000;
	font: bold;
	font-size: 20px;
}

.post .date {
	float: right;
	margin-top: -35px;
	padding-right: 20px;
	font-family: Inter, "Inter", Times, serif;
	font-weight: normal;
	font-size: 18px;
	color: #000000;
}

.post .meta {
	margin: -35px  0 3px 885px;
	padding: 2px 30px 2px 0px;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	color: #B6ACA2;

}

.post .meta a { color: #B6ACA2; }

.post .entry {
	padding: 25px 20px 0px 20px;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	color: #000000;

 }

.post .links {
	margin: 0 250px 0 0;
	padding: 0 0 0 0px;
}

.post .links .comments {
}

.post .links .permalink {
	padding-left: 17px;
}

/* Sidebar */

#sidebar {
	float: left;
	width: 280px;

}

#sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: normal;
}

#sidebar li {
	/* margin-bottom: 30px;
	padding: 0 0 20px 0px; */

}

#sidebar li ul {
	line-height: 200%;
}

/* #sidebar li li {
	margin: 0;
	padding: 0 20px;
} */

#sidebar p {
	margin: 0;
	padding: 0 20px;
}

#sidebar ul li h3{
	margin: 0;
	padding: 0;
	background: url(img06.gif) no-repeat;
}
#sidebar h2 {
	height: 33px;
	margin: 0 0 20px 0px;
	padding: 8px 0 2px 40px;
	background: url(img04_2.jpg) no-repeat left top;
	font-size: 20px;
	color: #000000;
}


#sidebar p {
	line-height: 200%;
}

/* Calendar */

#calendar {
}

#calendar caption {
	padding-bottom: 5px;
	font-weight: bold;
}

#calendar table {
	width: 100%;
	border-collapse: collapse;
	border-right: 1px solid #F5F2EF;
}

#calendar thead th {
	padding: 5px 0;
	text-align: center;
	border-top: 1px solid #F5F2EF;
	border-left: 1px solid #F5F2EF;
	background: #F5F2EF;
}

#calendar tbody td {
	padding: 5px 0;
	text-align: center;
	border-top: 1px solid #F5F2EF;
	border-left: 1px solid #F5F2EF;
}

#calendar tfoot td {
	padding: 5px;
}

#calendar tfoot #next {
	text-align: right;
}

#calendar #today {
	background: #E7F1E1;
}

/* Footer */
#wrapper_rodape {
  position:relative;
  width: 100%;
  height: 30px;
  margin: 110 auto;
}
#footer {
    position:relative;
	width: 100%;
	
	padding: 0;
	height: 25px;
	color: black;
	/*background: #008B8B; descomentar aqui para o rodape */
	/*background: #8B0000; vinho*/
	/*background:#0000FF azul 1*/
	background:#27408B
}
#rodape {
	width:77vw;
	/* padding: 20px; */
	margin-top: 0px;
	margin-bottom: 0px;
    margin-left: 285px;
    margin-right: auto; /* Centraliza na tela */
    border-radius: 5px; /* Opcional: bordas arredondadas */
	
	font-family: Inter;	 	
	
	background-color: #333;
    color: white;
    text-align: center;

    height: 40px; /* Deixando mais fino */
	
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	 gap: 1px; /* Controla o espaço entre as linhas */

    font-family: 'Inter', sans-serif;
    font-size: 14px;

}
#rodape p,
#rodape a {
    margin: 0;
    line-height: 1;
	color: white; /* Cor branca */
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
}

#rodape a:hover {
    /*text-decoration: underline;*/
}

#footer p {
	margin: 0;
	padding: 20px 0;
	text-align: center;
	line-height: normal;
	color: #FFFFFF;
}

#footer a {
	color: #F1B566;
}


#sddm
{	margin: 0;
	padding: 0;
	z-index: 30;
	font-family: 'Inter', Helvetica, sans-serif;

    }

#sddm li
{	margin: 0;
	padding:  5px  0px 5px 30px;
	list-style: none;
	float: left;
	font: bold 11px arial;
  	font-family: 'Tahoma', Helvetica, sans-serif;
    font-size: 15px;
   	z-index: 30;
    }

#sddm li a
{
    text-decoration: none;
    display: block;
	margin: 0 5px 0 0;
	background: transparent;
	color: #FFF;
	text-align: left;
	font-family: 'Tahoma', Helvetica, sans-serif;
    font-size: 15px;
}

#sddm li a:hover
{	text-decoration: none;
    background:transparent;
	font-family: 'Tahoma', Helvetica, sans-serif;
    font-size: 15px;
}

#sddm div
{	position: absolute;
	visibility: hidden;
	margin: 0;
	padding: 0;
	background: #612F9D;
	font-family: 'Inter', Helvetica, sans-serif;
	font-size: 12px;
	}

	#sddm div a
	{	position: relative;
		display: block;
		margin: 0;
		padding: 5px 5px;
		width: auto;
		white-space: nowrap;
		text-align: left;
		text-decoration: none;
		background: #FFFFFF;
		color: #612F9D;
		font-family: 'Inter', Helvetica, sans-serif;
        font-size: 12px;
        }

	#sddm div a:hover
	{	background: #612F9D;
		color: #FFF;
		font-family: 'Inter', Helvetica, sans-serif;
        font-size: 12px;
        }


input.invisible{
    visibility:hidden;
    border: 0;
    color: #FFFFFF;
}

input.check{
    font: bold;
    background:#FFFFFF url('check.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.unckeck{
    font: bold;
    background:#FFFFFF url('unckeck.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.excel{
    font: bold;
    background:#FFFFFF url('excel_down.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.calendar{
    font: bold;
    background:#FFFFFF url('calendar.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.pdfr{
    font: bold;
    background:#FFFFFF url('pdfr.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 33px;
    height:31px;
}

input.base{
    font: bold;
    background:#FFFFFF url('db_down.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 33px;
    height:31px;
}


input.inativar{
    background: #FFFFFF url('inativar.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

input.alterar{
    background: #FFFFFF url('alterar.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

input.reset{
    background: #FFFFFF url('reset.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

input.escalonar{
    background: #FFFFFF url('escalonar.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

#painel {
	margin-bottom: 0px;
	height: 0px;
	color: #000000;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	margin: 0px  0px 0px 0px;

}

#painelcont {
	margin-bottom: 0px;
	height: 0px;
	color: #000000;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	margin: 0px  0px 0px 250px;
}

#contentp {
	float: right;
	width: 615px;
	overflow: scroll;
}

#contentcont {
	float: left;
	width: 900px;
    height: 250px;
    overflow: auto;
}

#barrahorizontal {
    width: 700px;
    overflow: auto;
}

#painel2 {
	height: 30px;
	margin: 0px  5px 20px 0px;
	float: left;
	width: 280px;
	margin-bottom: 30px;
	color: #000000;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
}

.container-fluid.collapsed {
  margin-left: var(--sidebar-collapsed-width)!important;
}

.saudacao, .dados {
	display: flex;
    flex-direction: column;

	justify-content: center;
	margin: 0 auto;
	padding: 0px 10px 0px 10px;
	width: 100%;
	height: 100%;
	background-color: #FFFFFF;
	font-family: Inter;
}

.saudacao{
	padding: 0px;
}

.saudacao {
	align-items: start;
}

.dados {
	align-items: end;
}

.logo-dados-logo{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
	width: 100%;
	height: 100%;
	background-color: #FFFFFF;
	font-family: Inter;
}

.cab_logo {
	margin-right: 5px;
}

.container-fluid {
	margin-left: var(--sidebar-width)!important;
	padding-top: 0px;
	
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;

	width: auto!important;
}

#telaprincipal{
	margin: 1%  15% 0px 5px;
}

#imagem_menu {
	width: 900px;
	height: 70px;
	top: -10px;
	margin: 0 auto;
	font-family: "Inter";
	background: url(img01.jpg) no-repeat left top;
}

#opcaohome {
	width: 50px;
	top: -50px;
	left:320px;
    font-size: 0.97em;
    font-family: 'Inter', Helvetica, sans-serif;
}


#margem{
	position:relative;
	top:0px;
	left:40px;
}

#contaatual{
    position:relative;
    width: 210px;
	height: 10px;
	left:710px;	
	top:-25px;
}

#selecionaconta{
    position:relative;
    width: 10px;
	height: 10px;
	left:655px;	
	top:-120px;
}


#margemmenuconta{
	top:0px;
	left:60px;
}

#titulo_manter_usuario20{
    font-family: century gothic;
	font-size: 13px;
	
    /*position:relative; */
    z-index:0;
	color:black;	
	/*background: url(img01.jpg) no-repeat left top;*/
	background: url(img01.jpg);	
}

#printpage .oks{
    height:3px;
    border: 0;
    background-color: #7577c2;
    display: block;
}

#printpage .oka{
    height:3px;
    border: 0;
    background-color: #00a3a2;
    display: block;
}

#printpage LEGEND.lgd{
    font-family: 'Inter', Helvetica, sans-serif;
    font: bold;
    font-size: 1.1em;
	color: #000000;
}


#printpage table{
    font: normal 1em;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #000000;
}


#printpage td.ctd{
    font-size: 1.1em;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage td.ctdok{
    height:3px;
}

#printpage tr.ctra{
    background-color:#00a3a2;
    line-height:20px;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage tr.ctrs{
    line-height:20px;
    background-color:#7577c2;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage tr.ctrtg{
    line-height:20px;
    background-color:#eb7746;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
	border-color: #eb7746;
}

#printpage td.ctdts{
    line-height:20px;
    font-family: 'Inter', Helvetica, sans-serif;
	background-color:#7577c2;
	color:  #FFFFFF;
	font: bold 0.9em;
}

#printpage td.ctds{
    line-height:20px;
    background-color:#7577c2;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}

#printpage td.ctdta{
    line-height:20px;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #00a3a2;
	font: bold 0.9em;
}

#page FIELDSET{
	font-family: "Inter", Arial, Helvetica, sans-serif;
	color: #8080FF;
	font:nomal 1em;

}


h1, h2, h3 {
	margin: 0;
	font-family: Inter, "Inter", Times, serif;
	font-weight: normal;
	color: #649632;
	font: bold;
}

h1 { font-size: 44px; }

h2 {
     font-size: 15px;
     font: bold;
     }

h3 {

}

p, ul, ol {
	margin-top: 0;
	line-height: 240%;
	text-align: justify;
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-size: 11px;
}

ul, ol { }

blockquote { }

a { color: #000000; }

a:hover { text-decoration: none; }

a img {
	border: none;
}

img.left {
	float: left;
	margin: 7px 30px 0 0;
}

img.right {
	float: right;
	margin: 7px 0 0 30px;
}

hr { display: none; }

.list1 {
}

.list1 li {
	float: left;
	line-height: normal;
}

.list1 li img {
	margin: 0 30px 30px 0;
}

.list1 li.alt img {
	margin-right: 0;
}

#wrapper {
}

/* Header */

#header-wrapper {
	width: 880px;
	height: 30px;
	margin: 0 auto;
}

#header {
	width: 900px;
	height: 30px;
	margin: 0 auto;

}

/* Menu */

#menu {
	float: left;
	width: 900px;
	height: 30px;

}

#menu h1{
	margin: 10px  0 0 0px;
	padding: 0 0 0px 0;
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font: bold;
	color: #FFFFFF;
}

.botao{
    border: solid 1px blue;
    border-radius: 20px;
    color: blue;
    background-color: white;
	font-family: century gothic;
	font-size: 13px;
    transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease;
}
.botao:hover{
    background-color: blue;
    color: white;
    transform: scale(1.1)
}

/* Page */

#page {
	width: 900px;
	margin: 0 auto;
	padding: 15px 0px 0px 0px;
	z-index:3;
    background-color: #FFFFFF
}

#logo h1, #logo p {
	margin: 0;
	padding: 0 0 0 220px;
	line-height: normal;
}

#logo h2 p {
	margin: 0px  0 0 0px;
	padding: 200px 0 0px 0;
    font: 15px;
    line-height: normal;
}
#logo h1 { 	float: left;
padding-top: 80px;
 }

#logo h1 a {
	text-decoration: none;
	color: #000000;
	margin: 0px  0 0 170px;
}

#logo h1 a:hover { text-decoration: underline; }

#logo p {
	padding: 130px 0px 0px 0px;
	font: italic 13px Inter, 'Inter', Times, serif;
	color: #000000;
}

#logo p a {
	color: #000000;
}

#logo p a:hover { text-decoration: underline; }

/* Content */

#content {
	float: right;
	width: 600px;

}

/* Post */

.post {
	margin-bottom: 15px;
}

.post .title {
	height: 30px;
	margin-bottom: 3px;
	padding: 8px 0px 2px 40px;
	background: url(img05.jpg) no-repeat left top;
	color: #000000;
	font: bold;
}

.post .titulo {
	height: 1px;
	margin-bottom: 3px;
	padding: 8px 0px 3px 0px;
	/*background: url(images/img10.jpg) no-repeat left top; */
	color: #000000;
	font: bold;
	font-size: 20px;
}

.post .date {
	float: right;
	margin-top: -35px;
	padding-right: 20px;
	font-family: Inter, "Inter", Times, serif;
	font-weight: normal;
	font-size: 18px;
	color: #000000;
}

.post .meta {
	margin: -35px  0 3px 885px;
	padding: 2px 30px 2px 0px;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	color: #B6ACA2;

}

.post .meta a { color: #B6ACA2; }

.post .entry {
	padding: 25px 20px 0px 20px;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	color: #000000;

 }

.post .links {
	margin: 0 250px 0 0;
	padding: 0 0 0 0px;
}

.post .links .comments {
}

.post .links .permalink {
	padding-left: 17px;
}

/* Sidebar */

#sidebar {
	float: left;
	width: 280px;
}

/* Add collapsed state width */
#sidebar.collapsed {
    width: 80px !important;
}

#sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: normal;
}

#sidebar li ul {
	line-height: 200%;
}

#sidebar li li {
	margin: 0;
	padding: 0 20px;
}

#sidebar p {
	margin: 0;
	padding: 0 20px;
}

#sidebar ul li h3{
	margin: 0;
	padding: 0;
	background: url(img06.gif) no-repeat;
}
#sidebar h2 {
	height: 33px;
	margin: 0 0 20px 0px;
	padding: 8px 0 2px 40px;
	background: url(img04_2.jpg) no-repeat left top;
	font-size: 20px;
	color: #000000;
}


#sidebar p {
	line-height: 200%;
}

/* Calendar */

#calendar {
}

#calendar caption {
	padding-bottom: 5px;
	font-weight: bold;
}

#calendar table {
	width: 100%;
	border-collapse: collapse;
	border-right: 1px solid #F5F2EF;
}

#calendar thead th {
	padding: 5px 0;
	text-align: center;
	border-top: 1px solid #F5F2EF;
	border-left: 1px solid #F5F2EF;
	background: #F5F2EF;
}

#calendar tbody td {
	padding: 5px 0;
	text-align: center;
	border-top: 1px solid #F5F2EF;
	border-left: 1px solid #F5F2EF;
}

#calendar tfoot td {
	padding: 5px;
}

#calendar tfoot #next {
	text-align: right;
}

#calendar #today {
	background: #E7F1E1;
}

/* Footer */


#footer p {
	margin: 0;
	padding: 20px 0;
	text-align: center;
	line-height: normal;
	color: #FFFFFF;
}

#footer a {
	color: #F1B566;
}


#sddm
{	margin: 0;
	padding: 0;
	z-index: 30;
	font-family: 'Inter', Helvetica, sans-serif;

    }

#sddm li
{	margin: 0;
	padding:  5px  0px 5px 30px;
	list-style: none;
	float: left;
	font: bold 11px arial;
  	font-family: 'Tahoma', Helvetica, sans-serif;
    font-size: 15px;
   	z-index: 30;
    }

#sddm li a
{
    text-decoration: none;
    display: block;
	margin: 0 5px 0 0;
	background: transparent;
	color: #FFF;
	text-align: left;
	font-family: 'Tahoma', Helvetica, sans-serif;
    font-size: 15px;
}

#sddm li a:hover
{	text-decoration: none;
    background:transparent;
	font-family: 'Tahoma', Helvetica, sans-serif;
    font-size: 15px;
}

#sddm div
{	position: absolute;
	visibility: hidden;
	margin: 0;
	padding: 0;
	background: #612F9D;
	font-family: 'Inter', Helvetica, sans-serif;
	font-size: 12px;
	}

	#sddm div a
	{	position: relative;
		display: block;
		margin: 0;
		padding: 5px 5px;
		width: auto;
		white-space: nowrap;
		text-align: left;
		text-decoration: none;
		background: #FFFFFF;
		color: #612F9D;
		font-family: 'Inter', Helvetica, sans-serif;
        font-size: 12px;
        }

	#sddm div a:hover
	{	background: #612F9D;
		color: #FFF;
		font-family: 'Inter', Helvetica, sans-serif;
        font-size: 12px;
        }

/*input.submit{
    border: solid 1px blue;
    border-radius: 20px;
    color: blue;
    background-color: white;
	font-family: Inter;
	font-size: 13px;
    transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease;
}*/

input.invisible{
    visibility:hidden;
    border: 0;
    color: #FFFFFF;
}

input.check{
    font: bold;
    background:#FFFFFF url('check.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.unckeck{
    font: bold;
    background:#FFFFFF url('unckeck.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.excel{
    font: bold;
    background:#FFFFFF url('excel_down.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.calendar{
    font: bold;
    background:#FFFFFF url('calendar.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 28px;
    height:27px;
}

input.pdfr{
    font: bold;
    background:#FFFFFF url('pdfr.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 33px;
    height:31px;
}

input.base{
    font: bold;
    background:#FFFFFF url('db_down.jpg') no-repeat;
    border: 0;
    color: #FFFFFF;
    width: 33px;
    height:31px;
}


input.inativar{
    background: #FFFFFF url('inativar.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

input.alterar{
    background: #FFFFFF url('alterar.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

input.reset{
    background: #FFFFFF url('reset.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

input.escalonar{
    background: #FFFFFF url('escalonar.jpg') no-repeat;
    border: 0;
    width: 16px;
    height:16px;
}

#painel {
	margin-bottom: 0px;
	height: 0px;
	color: #000000;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	margin: 0px  0px 0px 0px;

}

#painelcont {
	margin-bottom: 0px;
	height: 0px;
	color: #000000;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	margin: 0px  0px 0px 250px;
}

#contentp {
	float: right;
	width: 615px;
	overflow: scroll;
}

#contentcont {
	float: left;
	width: 900px;
    height: 250px;
    overflow: auto;
}

#barrahorizontal {
    width: 700px;
    overflow: auto;
}

#painel2 {
	height: 30px;
	margin: 0px  5px 20px 0px;
	float: left;
	width: 280px;
	margin-bottom: 30px;
	color: #000000;
	font-family: 'Inter', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
}

/* Fix for sidebar menu */
.sidebar-container {
    overflow-x: hidden;
    width: 250px;
}

.sidebar-container.collapsed {
    width: 80px;
}

/* Fix message table layout */
.messages-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}

.messages-table th, 
.messages-table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid rgba(170, 170, 170, 0.3);
    vertical-align: top;
    word-wrap: break-word;
    overflow: hidden;
}

/* Column widths */
.messages-table th:nth-child(1), 
.messages-table td:nth-child(1) {
    width: 15%;
}

.messages-table th:nth-child(2), 
.messages-table td:nth-child(2) {
    width: 30%;
}

.messages-table th:nth-child(3), 
.messages-table td:nth-child(3) {
    width: 15%;
}

.messages-table th:nth-child(4), 
.messages-table td:nth-child(4) {
    width: 15%;
}

.messages-table th:nth-child(5),
.messages-table td:nth-child(5) {
    width: 10%;
}

.messages-table th:nth-child(6),
.messages-table td:nth-child(6) {
    width: 15%;
}

/* Status badge styling */
.status-badge {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 4px;
    text-align: center;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 500;
}

.status-badge.not-read {
    background-color: #007bff;
    color: white;
}

.status-badge.read {
    background-color: #28a745;
    color: white;
}

.message-attachment a {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Footer styling */
.footer {
    position: relative;
    width: calc(100% - 250px);
    margin-left: 250px;
    padding: 20px;
    background: white;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s;
}

.sidebar-container.collapsed ~ .footer {
    width: calc(100% - 80px);
    margin-left: 80px;
}

/* For mobile */
/*@media (max-width: 991px) {
    .main-content,
    .footer {
        margin-left: 0;
        width: 100%;
    }
}*/

/* Action buttons */
.action-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

/* Modern messaging system styles */
/* ============================== */

/* Reset table styling for messages */
.messages-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    margin-bottom: 20px;
}

.messages-table th, 
.messages-table td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #dee2e6;
    overflow: hidden;
}

/* Specific column widths */
.messages-table th:nth-child(1), 
.messages-table td:nth-child(1) {
    width: 15%;
}

.messages-table th:nth-child(2), 
.messages-table td:nth-child(2) {
    width: 30%;
}

.messages-table th:nth-child(3), 
.messages-table td:nth-child(3) {
    width: 20%;
    word-break: break-word;
}

.messages-table th:nth-child(4), 
.messages-table td:nth-child(4) {
    width: 15%;
}

.messages-table th:nth-child(5), 
.messages-table td:nth-child(5) {
    width: 10%;
}

.messages-table th:nth-child(6), 
.messages-table td:nth-child(6) {
    width: 10%;
}

.message-attachment a {
    display: block;
    white-space: normal;
    word-break: break-all;
}

/* Status badge styling */
.badge-status, 
.status-badge {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
}

.badge-status.not-read, 
.status-badge.not-read,
.não.lida {
    background-color: #007bff;
    color: white;
}

.badge-status.read, 
.status-badge.read {
    background-color: #28a745;
    color: white;
}

/* Fix for sidebar scrolling */
.sidebar-container {
    overflow-x: hidden !important;
}

/* Fix the content width */
.content-wrapper {
    width: calc(100% - var(--sidebar-width));
    max-width: 100%;
    overflow-x: hidden;
}

.content-wrapper.collapsed {
    width: calc(100% - var(--sidebar-collapsed-width));
}

/* Responsive fixes for mobile */
@media (max-width: 992px) {
    .messages-table {
        display: block;
        overflow-x: auto;
    }
    
    .content-wrapper {
        width: 100%;
    }
}

/* Fix message content overflow */
.message-content {
    max-width: 100%;
    word-break: break-word;
    white-space: normal;
}

/* Ensure buttons don't break */
.action-buttons {
    flex-wrap: wrap;
}

.action-btn {
    white-space: nowrap;
}

:root {
	--primary-color: #0A1745;
	--secondary-color: #0078FF;
	--light-bg: #ffffff;
	--content-bg: #f8f9fa;
	--text-color: #FFFFFF;
	--gray-stroke: rgba(170, 170, 170, 0.3);
	--sidebar-collapsed-width: 60px;
}

body {
	font-family: 'Inter', sans-serif;
	background-color: var(--light-bg);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	color: var(--text-color);
	margin: 0;
	padding: 0;
}

.page-container {
	display: flex;
	flex: 1;
}

.content-wrapper {
	flex: 1;
	margin-left: var(--sidebar-width);
	transition: margin-left 0.3s;
	padding: 20px;
}

.content-wrapper.collapsed {
	margin-left: var(--sidebar-collapsed-width);
}

.header {
	padding: 20px 0;
	margin-bottom: 20px;
}

.header-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.header-title {
	font-size: 28px;
	font-weight: 500;
	color: #212529;
}

.user-info {
	display: flex;
	align-items: center;
	gap: 15px;
	text-align: right;
}

.user-details {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.user-details p {
	margin: 0;
	line-height: 1.4;
}

.user-email, .user-role {
	display: flex;
	align-items: center;
	gap: 5px;
}

.section-card {
	width: 100%;
	/*width: 1050px;*/
	background: #fff; /*#DCDCDC;*/
	border-radius: 0.5rem;; /*8px;*/
	border: 1px solid var(--gray-stroke);
	padding: 1.5rem; /*20px;*/
	margin-bottom: 1.5rem; /*20px;*/
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); /* 0 2px 4px rgba(0, 0, 0, 0.05);*/
}
.section-card-fundo-branco {
	/*width: 100%;*/
	width: 1045px;
	background: white;
	border-radius: 8px;
	border: 1px solid var(--gray-stroke);
	/*border: 1px groove black; /* <-- alterado para preto */
	padding: 20px;
	margin-bottom: 20px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}



.section-card-fundo-branco-meus-tkt {
	/*width: 100%;*/
	width: 450px;
	background: white;
	border-radius: 8px;
	border: 0px solid var(--gray-stroke);
	/*border: 1px groove black; /* <-- alterado para preto */
	padding: 20px;
	margin-bottom: 00px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
	display: flex;
	justify-content: center; /* alinha horizontalmente */
	align-items: center;     /* alinha verticalmente */
	/*flex-direction: column; */ /* empilha verticalmente */
	height: auto;           /* defina altura se quiser centralizar verticalmente */	
}


.section-card-tick {
  width: 1000px;
  max-width: 100%;
  background: white;
  border-radius: 8px;
  border: 1px solid var(--gray-stroke);
  padding: 20px;
  margin-bottom: 20px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  box-sizing: border-box; /* inclui padding e border dentro dos 950px */
  overflow-x: auto; /* permite rolagem se a tabela for maior que 950px */
 }
 
.section-card-comentarios {
	position:relative;
	width: 100%;
	/*width: 1050px;*/
	background: #DCDCDC; /*#DCDCDC;*/
	border-radius: 0.5rem;; /*8px;*/
	border: 1px solid var(--gray-stroke);
	/*padding: 1.5rem; /*20px;*/
	margin-bottom: 1.5rem; /*20px;*/
	margin-left: 0px; /*20px;*/
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); /* 0 2px 4px rgba(0, 0, 0, 0.05);*/
}
 
.section-title {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 15px;
	font-size: 26px;
	font-weight: 500;
	color: #212529;
}

.section-title i {
	color: var(--secondary-color);
}
#section tr.ctra{
    background-color:#00a3a2;
    line-height:20px;
    font-family: 'Inter', Helvetica, sans-serif;
	color: #FFFFFF;
}
.agenda-list {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	padding: 0;
	margin: 0;
	list-style: none;
}

.agenda-item {
	flex: 1 1 calc(33.333% - 10px);
	background: var(--content-bg);
	border-radius: 4px;
	padding: 15px;
}

.agenda-time {
	font-weight: 600;
	margin-bottom: 5px;
	color: #212529;
}

.action-buttons {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
	flex-wrap: wrap;
}
/* Botao Padrao - Azul Texto Branco */
.action-btn {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 15px;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	background: #1b204b;
	color: white;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.2s;
	white-space: nowrap;
}

/*.action-btn:hover {
	/*background: #f8f9fa;
	border-color: #adb5bd;
	color: #212529;*/
/*	background: var(--primary-color);
	color: white;
	border-color: var(--primary-color);
}*/
.action-btn:hover{
    /*background-color: blue;*/
    color: white;
	background-color: #162767;
    transform: scale(1.0);
}

.action-btn.active { 
	/* Exemplo de como usar este Active: <input name="voltar" class="action-btn active" type="button" value="Voltar" onclick="window.location='menuconta.php'"> */
	background: var(--primary-color);
	color: white;
	border-color: var(--primary-color);
}
/* FIM Botao Padrao - Azul Texto Branco */

/* Botao Padrao - Azul Texto Branco 
É uma cópia da classe action-btn (que está acima). Essa foi criada para facilitar a Mudança do Layout (JUL/2025).*/
input.submit {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 15px;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	background: #1b204b;
	color: white;
	font-weight: 500;
	text-decoration: none;
	transition: all 0.2s;
	white-space: nowrap;
}
/*.submit:hover{
    background-color: blue;
    color: white;
    transform: scale(1.1);
}*/

.submit:hover {
    color: white;
	background-color: #162767;
    transform: scale(1.0);
}

/* FIM Botao Padrao - Azul Texto Branco */


/* Botao Padrao ANTIGO Arredondado - Branco e Texto Azul - Passando o Mouse Azul e Texto Branco */
input.submit-redondo{
    border: solid 1px blue;
    border-radius: 20px;
    color: blue;
    background-color: white;
	font-family: Inter;
	font-size: 13px;
    transition: background-color 0.5s ease, color 0.5s ease, transform 0.5s ease;
}
.submit-redondo:hover{
    background-color: blue;
    color: white;
    transform: scale(1.1)
}
/* FIM Botao Padrao ANTIGO Arredondado - Branco e Texto Azul - Passando o Mouse Azul e Texto Branco */

.search-box {
	flex-grow: 1;
	max-width: 300px;
	margin-left: auto;
}

.search-form {
	position: relative;
	width: 100%;
}

.search-input {
	width: 100%;
	padding: 8px 15px;
	padding-left: 35px;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	font-family: 'Inter', sans-serif;
}

.search-icon {
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	color: #6c757d;
}

.messages-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
}

.messages-table th {
	background: #f8f9fa;
	padding: 12px 15px;
	text-align: left;
	border-bottom: 1px solid #dee2e6;
	font-weight: 500;
	color: #495057;
}

.messages-table td {
	padding: 12px 15px;
	border-bottom: 1px solid #dee2e6;
	vertical-align: middle;
}

.messages-table tr:hover {
	background-color: #f8f9fa;
}

.message-sender {
	font-weight: 500;
}

.message-content {
	max-width: 300px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.message-date {
	white-space: nowrap;
	color: #6c757d;
}

/* .message-attachment {
	display: flex;
	gap: 5px;
	flex-direction: column;
} */

.message-attachment a {
	color: var(--secondary-color);
	text-decoration: none;
	font-size: 14px;
}

.message-attachment a:hover {
	text-decoration: underline;
}

.action-link {
	color: var(--secondary-color);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.action-link:hover {
	text-decoration: underline;
}

.pagination {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 15px;
	padding: 10px 0;
}

.pagination-info {
	color: #6c757d;
	font-size: 14px;
}

.pagination-btns {
	display: flex;
	gap: 5px;
}

.pagination-btn {
	padding: 5px 10px;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	background: white;
	color: #495057;
	text-decoration: none;
}

.pagination-btn:hover {
	background: #f8f9fa;
}

.badge-status {
	padding: 5px 10px;
	border-radius: 4px;
	font-weight: 500;
	font-size: 12px;
}

.badge-status.not-read {
	background-color: #007bff;
	color: white;
}

.badge-status.read {
	background-color: #28a745;
	color: white;
}

.contact-footer {
	background: white;
	border-top: 1px solid #dee2e6;
	padding: 15px 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
	font-size: 14px;
	color: #6c757d;
}

.contact-info {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

/* Dialog styling */
.ui-dialog {
	font-family: 'Inter', sans-serif;
	border-radius: 8px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
	padding: 0!important;
	font-size: 14px!important;
}

.ui-dialog .ui-dialog-titlebar {
	background: var(--primary-color);
	color: white;
	border-radius: 4px 4px 0px 0px;
	padding: 15px;
	border: none;
}

.ui-dialog .ui-dialog-title {
	font-weight: 500;
	font-size: 18px;
}

.ui-dialog .ui-dialog-content {
	padding: 20px;
}

.ui-dialog .ui-dialog-buttonpane {
	border-top: 1px solid #dee2e6;
	padding: 15px;
	margin-top: 0;
}

.ui-dialog .ui-dialog-buttonpane button {
	background: var(--primary-color);
	color: white;
	border: none;
	border-radius: 4px;
	padding: 8px 16px;
	cursor: pointer;
	font-family: 'Inter', sans-serif;
	font-weight: 500;
}

.ui-dialog .ui-dialog-buttonpane button:hover {
	background: #0d286e;
}

.respond-btn {
	color: var(--secondary-color);
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 5px;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
}

.respond-btn:hover {
	text-decoration: underline;
}

/* Responsive styles */
@media (max-width: 992px) {
	.content-wrapper {
		margin-left: 0;
	}
	
	.content-wrapper.collapsed {
		margin-left: 0;
	}
	
	.header-content {
		flex-direction: column;
		align-items: flex-start;
		gap: 15px;
	}
	
	.user-info {
		align-self: flex-end;
	}
	
	.agenda-item {
		flex: 1 1 100%;
	}
	
	.action-buttons {
		flex-wrap: wrap;
	}
	
	.search-box {
		max-width: 100%;
		width: 100%;
		order: -1;
		margin-bottom: 10px;
	}
}

@media (max-width: 768px) {
	.action-buttons {
		flex-direction: column;
		align-items: stretch;
	}
	
	.section-title {
		font-size: 16px;
	}
	
	.header-title {
		font-size: 24px;
	}
	
	.table-responsive {
		overflow-x: auto;
	}
}

/* Estilos para melhorar a visualização mobile */
@media (max-width: 768px) {
    /* Tabela de mensagens responsiva para mobile */
    .messages-table {
        width: 100%;
        border-collapse: collapse;
    }
    
    /* Ocultar todas as colunas exceto De e Mensagem no mobile */
    .messages-table th:not(:nth-child(1)):not(:nth-child(2)),
    .messages-table td:not(:nth-child(1)):not(:nth-child(2)) {
        display: none;
    }
    
    /* Estilos para cabeçalho e células visíveis */
    .messages-table th, 
    .messages-table td {
        padding: 10px;
        border-bottom: 1px solid #dee2e6;
        background-color: #f8f9fa;
    }
    
    .messages-table th:first-child,
    .messages-table td:first-child {
        width: 30%;
        font-weight: 500;
    }
    
    .messages-table th:nth-child(2),
    .messages-table td:nth-child(2) {
        width: 70%;
    }
    
    /* Remover bordas arredondadas e ajustar preenchimento */
    .section-card {
        border-radius: 0;
        padding: 10px;
        margin-bottom: 10px;
    }
    
    /* Estilo para mensagens */
    .message-content {
        white-space: normal;
        line-height: 1.4;
    }
    
    /* Header responsivo para mobile como na imagem 4 */
    .header-content {
        padding: 10px;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .header-title {
        font-size: 22px;
        margin-bottom: 10px;
    }
    
    /* Ajuste do perfil de usuário */
    .user-info {
        width: 100%;
        margin-top: 10px;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .user-details {
        align-items: flex-start;
    }
    
    /* Agenda do dia no mobile */
    .agenda-list {
        padding-left: 15px;
    }
    
    .agenda-item {
        flex: 1 1 100%;
        padding: 5px 0;
        background: transparent;
        border-radius: 0;
        position: relative;
    }
    
    .agenda-item:before {
        content: "•";
        position: absolute;
        left: -15px;
    }
    
    /* Botões de ação mais compactos */
    .action-buttons {
        flex-wrap: wrap;
        gap: 8px;
    }
    
    .action-btn {
        padding: 8px 12px;
        font-size: 14px;
    }
    
    /* Ajustar o layout do conteúdo principal */
    .content-wrapper {
        padding: 0;
        margin-left: 0;
    }
    
    /* Menu hamburguer no canto superior direito */
    .toggle-menu {
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 1050;
    }
}

/* Estilos específicos para tabela de mensagens em modo de lista no mobile */
@media (max-width: 576px) {
    .messages-table thead {
        background-color: #f8f9fa;
    }
    
    .messages-table th:first-child {
        color: #495057;
    }
    
    .messages-table th:nth-child(2) {
        color: #495057;
    }
    
    .section-title {
        font-size: 16px;
        padding-left: 10px;
    }
    
    /* Ajustar a exibição da agenda para ficar como na imagem 4 */
    .agenda-item {
        display: flex;
        align-items: center;
        margin-bottom: 5px;
    }
    
    .agenda-time {
        display: inline-block;
        width: 60px;
        font-weight: 600;
        margin-right: 10px;
        margin-bottom: 0;
    }
    
    /* Remover padding excessivo no container principal */
    .section-card {
        padding: 10px;
    }
}

/* Estilo para o cabeçalho compacto no mobile como na imagem 4 */
@media (max-width: 768px) {
    .page-header {
        padding: 10px;
        background-color: var(--primary-color);
        color: white;
    }
    
    .page-header h1 {
        font-size: 20px;
        margin: 0;
        padding: 0;
    }
    
    .user-profile {
        display: flex;
        flex-direction: column;
        font-size: 14px;
    }
    
    .user-profile p {
        margin: 2px 0;
    }
    
    /* Logo no canto superior esquerdo */
    .logo-mobile {
        height: 30px;
        margin-right: 10px;
    }
    
    /* Menu fixo no topo no mobile */
    .sidebar-container.mobile-visible {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        z-index: 1040;
    }
}

.container-fluid{
	width: auto;
}

.pagination-container, .action-buttons{
	font-size: 12px;
}

.sidebar-menu-item:hover, a:hover {
	background-color: var(--primary-light);
	color: var(--text-color);
}

.main-content {
	font-size: 16px;
}

.list-group-item{
	padding: 4px 10px;
}

.table {
	font-size: 14px;
}

/* INICIO DIFINE TABELA */
/* Estilo base da tabela */
.tabela-com-borda {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Century Gothic', 'Inter', Arial, sans-serif;
    font-size: 14px;
}

.tabela-com-borda th,
.tabela-com-borda td {
    border: 1px solid #333;
    padding: 8px;
}

/* Estilos de cabeçalho por tipo */
.cabecalho-azul th {
    background-color: #4285f4;
    color: white;
}

.cabecalho-verde th {
    background-color: #34a853;
    color: white;
}

.cabecalho-preto th {
    background-color: #000000;
    color: white;
}

.cabecalho-cinza-ardosia-escuro th {
    background-color: #2F4F4F;
    color: white;
}

/* Linhas pares com fundo diferente */
.tabela-com-borda tr:nth-child(even) {
    background-color: #f2f2f2;
}

/* Hover na linha */
.tabela-com-borda tr:hover {
    background-color: #ddd;
}

/* Alinhamentos personalizados */
.alinha-esquerda {
    text-align: left;
}

.alinha-centro {
    text-align: center;
}

.alinha-direita {
    text-align: right;
}
/* FIM DIFINE TABELA */
/* INICIO ESPACAMENTO ENTRE LINHAS */
.espaco {
  height: 16px; /* ajuste a altura conforme a "quebra" desejada */
}
.quebra {
  display: block;
  height: 16px;
}
/* FIM ESPACAMENTO ENTRE LINHAS */
/* definicao de padrao para o <a ref>
a {
    color: white; /* Cor padrão do link */
    text-decoration: none; /* Remove o sublinhado (opcional) */
}

/*a:visited {
    color: white; /* Cor quando já visitado */
}*/

a:hover {
    color: white; /* Mantém a mesma cor ao passar o mouse */
    text-decoration: underline; /* Opcional: sublinha no hover */
	background-color: white;
}

a:active {
    color: white; /* Cor quando está clicando */
	background-color: white;
}

a.link-usuario {
    color: blue; /* Cor padrão */
    text-decoration: underline; /* Mantém sublinhado, se desejar */
    background-color: transparent; /* Fundo transparente */
    font-family: century gothic,'Inter', Arial, sans-serif;
    font-size: 14px;
}

a.link-usuario:hover {
    color: blue; /* Mantém a mesma cor ao passar o mouse */
    background-color: transparent; /* Sem mudança de fundo */
    text-decoration: underline;
}
/* Stylo ComboBox */
.combo-style {
font-family: century gothic; 
font-size: 3; 
width:650px;
height:32px;
}

/*Configuração das Guias*/
	:root {	
		--primary-blue: #0A1745;
	}

	.nav-tabs .nav-link {
		color: #495057;
		background-color: #f8f9fa;
		border: 1px solid #dee2e6;
		border-bottom: none;
		border-radius: 0.25rem 0.25rem 0 0;
		padding: 0.5rem 1rem;
		margin-right: 0.25rem;
	}
	.nav-tabs .nav-link.active {
		color: #fff;
		background-color: var(--primary-blue);
		border-color: var(--primary-blue);
	}
	.tab-content {
		padding: 1rem;
		border: 1px solid #dee2e6;
		border-top: none;
		border-radius: 0 0 0.25rem 0.25rem;
	}
	.chart-container {
		min-height: 300px;
		margin-bottom: 1rem;
	}
	.section-card {
		/*background: #fff;
		border-radius: 0.5rem;
		box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
		padding: 1.5rem;
		margin-bottom: 	1.5rem;*/
	}
	.section-title {
		color: #2c3e50;
		margin-bottom: 1.5rem;
		font-size: 1.5rem;
	}
	.form-group {
		margin-bottom: 1rem;
	}
	.action-buttons {
		margin-bottom: 1.5rem;
	}
	.search-form {
		display: flex;
		gap: 1rem;
		align-items: flex-end;
	}
	.action-btn {
		padding: 0.375rem 0.75rem;
		border-radius: 0.25rem;
		border: 1px solid var(--primary-blue);
		background-color: var(--primary-blue);
		color: white;
		cursor: pointer;
	}
	.action-btn:hover {
		background-color: #162767;
	}
/*FIM Configuração das Guias*/
/* Tabela Personalizada */
.tabela-personalizada {
	width: 100%;  
	max-width: 100%;
	margin-left: -00px;       /* Margem à esquerda */	
	border-collapse: collapse;
	border: 1px solid #000;
}

.tabela-personalizada th,
.tabela-personalizada td {
    font-size: 0.90em;
    font-family: Inter;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 8px;
}
.tabela-personalizada td a:hover {
  background-color: transparent !important;
  color: inherit !important;
}
/* FIM Tabela Personalizada */