/* CSS reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, input, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	text-decoration: none;
	line-height: initial;
}

body {font-family: verdana, tahoma, arial; min-width: 980px;}
img { vertical-align: middle; }
a { color: #333; cursor: pointer; }
a:visited { color: #333 }
a:hover { color: #e17611 }
h1{ font-size: 25px; color: #0095b8;}
h2{ color: #e17611; font-weight: normal; font-size: 18px;}
p{ color: #333; font-size: 11px; text-align: justify; padding: 5px 0; clear: both; }
iframe{ overflow-x: hidden; }


/* Propriedades de estrutura */
/*** CABEÇALHO ***/
#head { padding: 10px; height: 75px; /*60px*/}
#head #logo{float: left; width: 280px }

#head #status-icon{ margin-left: 40px; float: left; font-size: 9px; color: #333; padding: 10px;}
#head #status-icon .number-mini-box{ background-color: #fff; padding: 0px 2px; border: 1px solid #ddd; position: absolute; right: 0px; top: 25px}
#head #status-icon  #status-late{ background: url('../content/images/status-late-requests.jpg') top left no-repeat; width:35px; height: 32px; position: relative; float: left;}
#head #status-icon  #status-assigned-to-me{ background: url('../content/images/status-assigned-to-me.jpg') top left no-repeat; width:37px; height: 32px; position: relative; float: left; margin-left: 20px;}
#head #status-icon  #status-pending-invite{ background: url('../content/images/status-pending-invite.jpg') top left no-repeat; width:37px; height: 32px; position: relative; float: left; margin-left: 20px;}

#head #profile-menu{ float: right; padding: 0 0 9px; width: 280px } 
#head #profile-menu #photo-profile-menu{ float: right; border: 1px solid #ddd;} 
#head #profile-menu #user-profile-menu{ float: right; margin: 9px 10px;}
#head #profile-menu #user-profile-menu .drop-button { text-align: center; color: #777; padding: 10px; font-size: 11px; display: inline-block; }
#head #profile-menu #user-profile-menu .drop-button:hover{ background-color: #f7f7f7; border-radius: 5px; }
#head #profile-menu #user-profile-menu .drop-button img { padding-bottom: 2px; }
#head #profile-menu #user-profile-menu .listItemSubtitle{ color: #0095B8; padding: 0 15px; font-weight: 600;}

#head #toolbar{ float: right; padding: 19px 5px;}
#head #toolbar ul { list-style: none; }
#head #toolbar ul li{ float: left; display: inline-block; }
#head #toolbar ul li a{ font-size: 10px; color: #777; padding: 0px 5px; border-right: 1px solid #999; }
#head #toolbar ul li a:visited{ color: #777; }
#head #toolbar ul li a:hover{ color: #e17611; }
#head #toolbar ul li a.first{ padding-left: 0px; }
#head #toolbar ul li a.last{ border-right: none; }


/*** MENU ***/
#menu { clear: both; }
#menu ul { list-style:none; width: 710px; float: left;}
#menu ul li { float:left; display: inline-block; margin-left: 10px; font-size: 11px; }
#menu ul li a{ background: #e0dedf url('../content/images/menu-item-bg.jpg') top left repeat-x; display: inline-block; padding: 5px 10px; 
			border-left: 1px solid #b1aeae; border-top: 1px solid #b1aeae; border-right: 1px solid #b1aeae; color: #333; border-radius: 5px 5px 0 0;}
#menu ul li a img { margin-right: 5px; }			
#menu ul li a #sprite-request{ background: url('../content/images/sprite.png')  -4px -2px no-repeat; width: 18px; height: 11px;  margin: 6px 0 0 6px; float: right; }
#menu ul li a #sprite-request.sprite-hover{ background: url('../content/images/sprite.png')  -4px -14px no-repeat; }
#menu ul li a #sprite-request.sprite-selected{ background: url('../content/images/sprite.png')  -4px -27px no-repeat; }
#menu ul li a:visited{ color: #333; }
#menu ul li a.selected{ background: #1e9dd0 url('../content/images/menu-item-selected-bg.jpg') top left repeat-x; border-left: 1px solid #046176; border-top: 1px solid #046176; border-right: 1px solid #046176; color: #fff; }
#menu ul li a.selected:hover, #menu ul li a:hover, #menu ul li a.hover{ background: #f78218 url('../content/images/menu-item-hover-bg.jpg') top left repeat-x; border-left: 1px solid #be6510; border-top: 1px solid #be6510; border-right: 1px solid #be6510; color: #fff; }

#menu #search { margin-left: 690px; margin-right: 10px; }
#menu #search form input { padding: 0; border: 0; border-radius: 0; }
#menu #search form input[type="text"]{ border-left: 3px solid #ddd; border-top: 3px solid #ddd; border-bottom: 3px solid #ddd; padding: 5px; color: #d9d9d9; float:right; width: 70%; font-size: 16px;}
#menu #search form a { border-left: 1px solid #ddd; border-top: 3px solid #ddd; border-bottom: 3px solid #ddd; border-right: 3px solid #ddd; float: right; }

#menu #search #searchAutoSugest {background-color: #fff; min-width: 300px; color: #363434; z-index: 99; position: absolute; right: 10px; margin-top: 40px; border: 3px solid #ddd; border-top-width: 0px; display: none;}
#menu #search #searchAutoSugest #searchLoader { text-align: center; padding-top: 5px; padding-bottom: 5px; }
#menu #search #searchAutoSugest p.searchResultTitle { font-weight: bold; color: #777; background-color: #ddd; padding: 3px; padding-bottom: 3px; }
#menu #search #searchAutoSugest .searchResultItem { display: block; padding: 3px; border-bottom: 1px solid #ddd; color: #333; cursor: pointer; font-size: 11px; clear: both; line-height: 18px;}
#menu #search #searchAutoSugest .searchResultItem img { padding-right: 3px;}
#menu #search #searchAutoSugest .searchResultItem .search-avatar { float: right; margin-left: 15px; padding: 0; border: 1px solid #ddd; width: 25px; height: 25px;}
#menu #search #searchAutoSugest .searchResultItem:hover { text-decoration: none; color: #575e77; background-color: #f7f7f7; }


#menu #bar { clear:both; background: url('../content/images/menu-bar-bg.jpg') top left repeat-x; height: 3px; border-top: 1px solid #115c6d; border-bottom: 1px solid #115c6d; }

#div-menu-request{ z-index:99; position: absolute; left: 414px; display:none; padding-top: 5px; margin-top: -5px;}
#div-menu-request ul{ list-style:none; width: 217px; font-size: 11px; }
#div-menu-request ul li a{ background: #f58216 url('../content/images/menu-item-hover-bg.jpg') top left repeat-x; display: block; padding: 5px 10px;
                      border-left: 1px solid #d67212; border-bottom: 2px solid #d67212; border-right: 1px solid #d67212; color: #fff; }
#div-menu-request ul li a img { margin-right: 5px; }			
#div-menu-request ul li a:hover{ background: #f58216 url('../content/images/menu-request-hover-bg.jpg') }
#div-menu-request ul li a:visited{ color: #fff; }
#div-menu-request ul li a.last{ border-radius: 0 0 5px 5px; }


/*** TÍTULO ***/
#bread-cumb{ padding: 20px 20px 0; /*padding-left: 30px;*/}
#bread-cumb a{ font-size: 11px; padding-bottom: 5px; display: inline-block; }
#bread-cumb h2{ color: #e17611; font-weight: normal; }
#bread-cumb h2 a{ color: #e17611; font-size: 14px; }
#bread-cumb h2 a:hover{ color: #ed8c31; }
#bread-cumb ul { list-style: none; }
#bread-cumb ul li{ float: left; display: inline-block; }
#bread-cumb ul li a{ font-size: 11px; color: #333; padding: 0px 5px; border-right: 1px solid #999;}
#bread-cumb ul li a:visited { color: #333 }
#bread-cumb ul li a:hover { color: #e17611 }
#bread-cumb ul li a.first{ padding-left: 0px; }
#bread-cumb ul li a.last{ border-right: none; }


/*** CONTEÚDO ***/
#content{ clear:both; padding: 10px; }
#content div.more-items{ text-align: center; font-size: 11px; display:block; color: #333; padding-top: 10px;}
#content div.more-items a { cursor: pointer;}
#content div.more-items img{ padding-right: 5px;}
#content table{ width: 100%; margin-top: 10px;}
#content table tr th{ background-color: #f3f3f3; font-size: 11px; color: #444; padding: 4px 2px; font-weight: normal; text-align: left; }
#content table tr td{ font-size: 11px; color: #333; vertical-align:middle;}
#content table tr td.icon-column { text-align: center; }
	/*#content table tr:hover{ background-color: #d7edf6; }*/
#content table tr:hover{ background-color: #ebebeb; }
#content table a{ display:block;  padding: 4px 2px; }
#content table a:hover{ color: #333; }
#content h3 { font-size: 14px; color: #555; padding-bottom: 5px; }
#content h4 { font-size: 12px; color: #555; padding-top: 10px;}

#content #left-column{ margin-right: 385px;}
#content #right-column{ width: 375px; float: right; }

#content #login-container{ width: 100%; padding: 60px 0 60px 0; float: left; }
#content #login-box{ width: 500px; margin: 0 auto;}
#content #login-box img{ padding-right: 50px; float:left}
#content #login-box form{ float: left }
#content #login-box form input{ width: 200px; }
#content #login-box form h1{ text-align: center; padding-bottom: 10px;}

#content #charsContainer{ margin-top: 30px; width: 100%; display: inline-block; height: 25px; }
#content #charsList.float{ position: fixed; left: 20px; top: 5px; margin: 0; }
#content #charsList a.charsListItem{ background-color: #ec933e; margin-right: 7px; font-size: 12px; padding: 4px 6px; float: left; border:1px solid #be8046; border-radius: 3px; color: #fff; opacity: 0.9; }
#content #charsList a.charListItemDisable{ background-color: #b69d85; margin-right: 7px; font-size: 12px; padding: 4px 6px; float: left; border:1px solid #998471; border-radius: 3px; color: #fff; }
#content #charsList a.charListItemDisable:hover{ cursor: default; }            
#content #charsList.float a.charsListItem{ opacity: 0.7; box-shadow: 1px 1px 5px 1px #bbb; }
#content #charsList.float a.charListItemDisable{  opacity: 0.7;  box-shadow: 1px 1px 5px 1px #bbb;}
#content #charsList a.charsListItem:hover{background-color: #fa881b; opacity: 1; } 

#content #request-details { display: inline-block; padding: 10px 0; }
#content #request-details .half-column { width: 50%; float: left; }
#content #request-details .display-label, #content .display-field { float: left; font-size: 11px; color: #333; padding-bottom: 10px; }
#content #request-details .display-label { width: 150px; color: #777; font-weight: bold; }
#content #request-details .detailsText { float: left; width: 100%; }

#content #CommentBox { display: block; font-size: 11px; }

#content #interactionList { padding-top: 20px; }
#content #interactionList .eventListItem { width: 100%; border-top: 1px solid #ddd; padding: 15px 0; clear: both; display: inline-block; }
#content #interactionList .eventListItem .request-avatar { width: 50px; height: 50px; float: left; }
#content #interactionList .eventListItem .request-history { margin-left: 60px }
#content #interactionList .eventListItem .request-history p { padding: 0 0 10px 0; }
#content #interactionList .eventListItem .request-history .evt-autor-name { display: inline-block; }
#content #interactionList .eventListItem .request-history .evt-date { float: right; }

#content #product-account-admins table{ margin: 0 0 10px 0;}
#content #product-account-admins table tr th{ background: none; color: #000; font-weight: bold; }
#content #product-account-admins table tr td{ font-size: 11px; color: #333; vertical-align:middle;}
#content #product-account-admins table tr:hover{ background: none; }
#content #product-account-admins table a{ padding: 0; display: inline-block; }
#content #product-account-admins table a:hover{ color: #e17611; }


#content .views{ display: inline-block; width: 100%; }
#content .views a.view-option { color: #777; font-weight: normal; font-size: 12px; padding: 7px 10px; float: left; margin: 10px 5px 0px 0; }
#content .views a.view-option.selected{ background-color: #eee; border-radius: 7px; }
#content .views a.view-option.selected:hover{ color: #555; }
#content .views a.view-option:hover { color: #e17611; }
#content .content-box{ margin-bottom: 10px; padding: 10px; border: 4px solid #ddd; border-radius: 10px; position: relative; }
#content .content-box .loader{ display: none; text-align: center; padding: 20px 0px;}

#content .listAlternate{ background-color: #f7f7f7; }

#content .listItem{ width:100%; display: inline-block; padding: 30px 0;  font-size: 11px; border-bottom: 1px solid #ddd; }
#content .listItem a.listItemTitleText { font-size: 14px; font-weight: bold; color: #555;}
#content .listItem a.listItemTitleText:hover{ color: #E17611; cursor: pointer; }
#content .listItem h3{ color: #444; font-size: 12px;}
#content .listItem .listItemField{ float: left; margin-right: 20px; margin-top: 10px; }
#content .listItem .listItemSubtitle{ color: #0095B8; padding-bottom: 10px; font-weight: 600;}
#content .listItem .listItemSubmenu{ margin-left: 29px; }
#content .listItem .listItemDetails{ color: #555; padding: 20px 0; }
#content .listItem .projectList h3{ color: #555; padding-bottom: 10px; }
#content .listItem .projectListItem{ padding-bottom: 10px; }

#content .chart-filter { text-align: right; font-size: 11px; }
#content .chart-filter input { margin: 0px 10px 0px 5px; }
#content .chart-filter span { margin-right: 10px; }
#content .chart-filter .other-button { padding: 6px; }

#content .attached-files { width: 100%; padding: 10px 0; display: inline-block; }
#content .attached-files a { font-size: 11px; }

/*** RODAPÉ ***/
#footer { clear:both; }
#footer #footer-box { background-color: #acabab; border-radius: 10px; padding: 20px 0px; float: left; width: 100%; display: none }
#footer #footer-box .footer-column{ width: 25%;  float: left; }
#footer #footer-box h4{ color: #fff; font-size: 12px; padding-left: 30%; }
#footer #footer-box ul { list-style: none; padding-left: 30%; }
#footer #footer-box ul li a{ font-size: 11px; color: #ccc; }
#footer #footer-box ul li a:visited{ color: #ccc; }
#footer #footer-box ul li a:hover{ color: #ddd; }
#footer #powered { clear:both; padding: 15px; text-align: center; font-size: 12px; color: #333;}


/*** FORMULÁRIO ***/
form{ font-size: 11px; color: #333; }
form select, form input, form textarea, select, textarea { background-color: #fff; padding: 5px 2px; color: #333; border: 1px solid #bebebe; border-radius: 5px; }
form select[disabled=""]{ color: #888; }
form input[type="text"].half, form input[type="password"].half, form textarea.half{ width: 250px; }
form input[type="text"]{ width: 540px; font-size: 13px; }
form input[type="text"].file{ background:url('../content/images/folder.png') 235px 5px no-repeat; cursor:pointer; }
form input[type="text"].datePicker { width: 70px; }
form input[type="file"]{ width: 400px; }
form textarea, textarea{ width: 540px; font-size: 13px; font-family: Verdana, Tahoma, Arial; }
.editor-field{ margin: 5px 0 10px 0; }
.editor-label{ margin-top: 5px }
form input[type="text"]#EstimatedHours {max-width: 65px !important;}

/*** BOTÃO ***/
a.action-button, button.action-button {
    background: #1e9dd0 url('../content/images/menu-item-selected-bg.jpg') top left repeat-x;
    padding: 10px;
    display: inline-block;
    border: 1px solid #046176;
    color: #fff;
    border-radius: 5px;
    margin-right: 5px;
    font-size: 12px;
    cursor: pointer;
}
a.action-button:hover{ background: #38abd9 url('../content/images/action-button-hover-bg.jpg') top left repeat-x; border: 1px solid #088aa7; }		                    
a.other-button, a.assign-button, #content a.img-button{ background: #e0dedf url('../content/images/other-button-bg.jpg') top left repeat-x; display: inline-block; 
                              border: 1px solid #b1aeae; color: #545454; border-radius: 5px; margin-right: 5px; font-size: 12px; cursor: pointer;}
a.other-button:hover, a.assign-button:hover, #content a.img-button:hover{ background: #e8e6e7 url('../content/images/other-button-hover-bg.jpg') top left repeat-x; border: 1px solid #c2c1c1; }
a.img-button{ padding: 5px 10px; }
a.img-button img{ padding-right: 5px; }
a.other-button{ padding: 10px; white-space: nowrap }
a.assign-button { padding: 7px 10px; }


/*** CALENDÁRIO ***/
.ui-datepicker { font-size: 12px; }


/*** MENSAGEM/ERRO ***/
input.error, textarea.error, select.error{ background-color: #ffebeb; border-color: Red; box-shadow: 0 0 4px 1px #FF0000; }
label.error{ color: Red; padding: 10px;}

.validation-summary-errors{ text-align: center }
.validation-summary-errors ul {background-color: #ffebeb; padding: 5px; list-style: none; color: Red; border: 1px solid #ffbdbd; margin: 10px auto; display: inline-block; border-radius: 5px; }

/*** CAMPOS EM DESTAQUE ***/
input.highlight, textarea.highlight, select.highlight{ background-color: #f2f9fc; border-color: #046176; box-shadow: 0 0 4px 1px #1ea0d4; color: #888;}


/*** CLASSE E ID SOLTA ***/
form.iframe { padding: 5px 7px; }
div.file{ padding-top: 10px; }
div.itemList{ font-size: 11px; }
div.itemList table { margin: 15px 0; width: 100%; text-align: left;} 
div.itemList table tr { width: 10px; }

iframe input {width: 350px; }

.text-hint{ color: #888; }

.fileName {  }

#profile-photo-editor { background-image: url(images/dbImages/photos/avatar-default-medium.jpg); border: 7px solid #d9d9d9; width: 300px; height: 300px; margin-top: 30px; margin-bottom: 15px; }
#profile-photo-editor span { text-align: center; margin-top: 140px; display: block; color: #999; background-color: #d9d9d9; padding: 3px; margin-left: 20px; margin-right: 20px; }
#profile-photo-editor div { background-color: #fff; opacity: 0.90; width: 300px; height: 300px; display: none; }
#profile-photo-editor div img { margin-left: 130px; margin-top: 130px; }

/**#profile-photo-editor.filled { background-image: **/

#initialsSuggests span { margin: 10px 0px 20px 10px; display: inline-block; background-color: #f0f0f0; border: 1px solid #ccc; border-radius: 3px; padding: 5px; cursor: pointer; }
#initialsSuggests span:hover { background-color: #dcdcdc; border: 1px solid #aaa; }

#searchCustomerAutoSugest { background-color: #fff; width: 544px; border-radius: 0 0 5px 5px; display: none; border: 1px solid #bebebe; border-top: none; }
#searchCustomerAutoSugest a { padding: 8px 5px; display: block; }
#searchCustomerAutoSugest a:hover { background-color: #3399ff; color: #fff; }

#create-customer { background-color: #fafafa; border: 1px solid #bebebe; border-radius: 5px; display: none; }
#create-customer iframe { width: 100%; }

#customer .btn-create-customer {padding-bottom: 5px; }
#customer .btn-new-customer { margin-top: 10px; padding-bottom: 5px; display: inline-block; }

.text-hint{ color: #888; }

.float { float: left; display: inline-block; padding-right: 10px; }

#project-applied-effort .totals { display: grid; grid-template-columns: repeat(6, 1fr); font-size: 14px; margin-bottom: 20px; align-items: center; }
#project-applied-effort .totals div { text-align: center; }
#project-applied-effort .totals .label { color: #777; font-weight: bold; }
#project-applied-effort table .center { text-align: center; }
/*#project-applied-effort table tr.billable th { background-color: #f5e9d1; }*/
#project-applied-effort table tr.billable th { background-color: #f4f4f4; }
#project-applied-effort table tr.not-billable th { background-color: #fff0d0; }
#project-applied-effort table tr { padding: 8px 0; height: 30px; border-bottom: 1px solid #f5f5f5 }

.titulo-projeto {
	cursor: pointer;
}

.titulo-projeto:hover ~ projeto-items div {
	display: block;
	background: red;
}

.projeto-items div {
	display: none;
}

.projeto-items.ativo div {
	display: block;
}


.projeto-items div p {
	padding: 0;
	margin: 0;
	line-height: 18px;
}

.projeto-items div p > a {
	display: block;
	color: #555;
	text-decoration: none;
	line-height: 18px;
	padding: 3px 15px;
	white-space: nowrap;
}

.projeto-items div p > a:hover {
	background: #1e9dd0 url(../content/images/menu-item-selected-bg.jpg) top left repeat-x;
	color: #FFF !important;
	cursor: pointer;
}

.alt-title {
	color: #0095b8;
	padding: 0 0 5px 0 !important;
}

.alt-phrase span {
	font-style: italic;
	color: #bbb;
}

.alt-phrase img {
	width: 10px;
	margin: 0 6px;
}

/*--------------- Dashboard ---------------*/
#detail-menu{ padding: 0; display: flex; justify-content: flex-end; gap: 28px; height: 42px} 
/* #detail-menu #detail-project-menu-dropdown{ margin: 9px 10px;} */
#detail-menu .drop-button {background: #f7f7f7; text-align: center; color: #777; padding: 12px; font-size: 14px; display: inline-block; border-radius: 5px; width: max-content}
#detail-menu .drop-button:hover{ background-color: #e6e6e6 }
#detail-menu .drop-button img { padding-bottom: 2px; }
#detail-menu .listItemSubtitle{ color: #333; padding: 8px 15px; font-weight: 600; font-size: 12px; border: none; width: 100%}
#detail-menu .listItemSubtitle:hover {backdrop-filter:brightness(95%)}
#project-menu-dropdown.dropdown-menu, #user-profile-menu-dropdown.dropdown-menu, #detail-project-menu-dropdown.dropdown-menu, #sprint-menu-dropdown.dropdown-menu, #scrum-menu-dropdown.dropdown-menu {
	padding: 0;
	background-color: transparent !important;
	border: none;
	top: inherit !important
}
#project-menu-dropdown.dropdown-menu {min-width: 260px}

#detail-menu .dropdown-menu ul {margin: 40px 0 0 0; padding: 0; display: flex; flex-direction: column}
#detail-menu .dropdown-menu ul li { border-bottom: solid 1px #E5E5E5 }
#detail-menu .dropdown-menu ul li:last-child { border-bottom: none }
#detail-menu .dropdown-menu.has-tip:before {top: 34px}
#detail-menu .dropdown-menu.has-tip:after {top: 35px}

.sprint-icon {width: 20px; fill: #0095B8; margin: 0 8px 0 0}
.sprint-icon.atual { fill: #4DB34D }
.sprint-icon.passado { fill: #CC5792 }

.dashboard-container .card {
	padding: 10px;
	border: 4px solid #ddd;
	border-radius: 10px;
	position: relative;
	overflow: hidden;
	margin: 0 0 16px 0;
	justify-content: space-between;
	padding: 10px 10px 22px;
}

.dashboard-container .card.tam-p {height: 130px;}

.dashboard-container .card.tam-m {height: 320px;}

.dashboard-container .card .card-title, .dashboard-container .card .card-subtitle {
	font-size: 12px;
	font-weight: 400;
	color: #777;
	padding: 0;
}

.dashboard-container .card .card-value {
	font-size: 32px;
	font-weight: 700;
	color: #555;
	fill: #777;
	padding: 0;
	font-family: verdana, tahoma, arial;
}

.dashboard-container .card .card-title {font-weight: 700;}
.dashboard-container .card .card-subtitle {}

.dashboard-container .card-border {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 16px;
	background: red;
}

.dashboard-container #estimative-task .card-border {
	background: #ccff00;
}

.dashboard-container #total-effort .card-border {
	background: #575757;
}

.dashboard-container #total-invoice .card-border {
	background: #4f7ed1;
}

.dashboard-container #total-invoiced .card-border {
	background: #4db34d;
}

.dashboard-container #total-internal-bonus .card-border {
	background: #cc5792;
}

.dashboard-container #total-public-bonus .card-border {
	background: #ffcf6a;
}



h2.title {
	font-size: 24px;
	font-weight: 700;
	color: #363636;
}

.project-name-text {
	font-size: 20px !important;
	font-weight: 700 !important;
	color: #474747 !important;
}

.estimate-wrapper .title {
	position: absolute;
	bottom: 0;
	text-align: center;
}

.estimate-wrapper .title span {
	font-size: 14px;
}

.estimate-wrapper .legend {
	width: 350px;
}

.estimate-wrapper .legend p {
	color: #777777;
	width: 80px;
	display: flex;
}

.estimate-wrapper {}

.semi-circle {
	position: relative;
	width: 350px;
	height: 175px;
	overflow: hidden;
}

.semi-circle:before {
	border: 50px solid #dddddd;
	border-bottom: none;
	top: 0;
	z-index: 1;
	border-radius: 200px 200px 0 0;
	width: 100%;
	height: 100%;
	content: "";
	position: absolute;
	transform-origin: 50% 0%;
	left: 0;
	box-sizing: border-box;
}

.arc {
	border: 50px solid;
	border-top: none;
	content: " ";
	display: block;
	border-radius: 0 0 200px 200px;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 175px;
	left: 0px;
	transform-origin: 50% 0;
	box-sizing: border-box;
	z-index: 2;
	border-color: #4F7ED1;
}

.arc:after {
	width: 5px;
	content: " ";
	transform: rotate(90deg);
	height: 60px;
	display: block;
	top: -30px;
	position: absolute;
	left: -28px;
	background: #4F7ED1;
}

.arc:nth-child(2):after {
	background: #cc5792;
}

.arc:nth-child(2) {
	border-color: #cc5792;
}

.arc:nth-child(3):after {
	background: #cc5792;
}

.arc:nth-child(3) {
	border-color: #cc5792;
}

.arc:nth-child(4):after {
	background: #cc5792;
}

.arc:nth-child(4) {
	border-color: #cc5792;
}

.arc[data-value="1"] {
	transform: rotate(1.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="2"] {
	transform: rotate(3.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="3"] {
	transform: rotate(5.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="4"] {
	transform: rotate(7.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="5"] {
	transform: rotate(9deg);
	animation: rotate 1s linear;
}

.arc[data-value="6"] {
	transform: rotate(10.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="7"] {
	transform: rotate(12.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="8"] {
	transform: rotate(14.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="9"] {
	transform: rotate(16.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="10"] {
	transform: rotate(18deg);
	animation: rotate 1s linear;
}

.arc[data-value="11"] {
	transform: rotate(19.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="12"] {
	transform: rotate(21.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="13"] {
	transform: rotate(23.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="14"] {
	transform: rotate(25.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="15"] {
	transform: rotate(27deg);
	animation: rotate 1s linear;
}

.arc[data-value="16"] {
	transform: rotate(28.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="17"] {
	transform: rotate(30.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="18"] {
	transform: rotate(32.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="19"] {
	transform: rotate(34.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="20"] {
	transform: rotate(36deg);
	animation: rotate 1s linear;
}

.arc[data-value="21"] {
	transform: rotate(37.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="22"] {
	transform: rotate(39.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="23"] {
	transform: rotate(41.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="24"] {
	transform: rotate(43.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="25"] {
	transform: rotate(45deg);
	animation: rotate 1s linear;
}

.arc[data-value="26"] {
	transform: rotate(46.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="27"] {
	transform: rotate(48.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="28"] {
	transform: rotate(50.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="29"] {
	transform: rotate(52.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="30"] {
	transform: rotate(54deg);
	animation: rotate 1s linear;
}

.arc[data-value="31"] {
	transform: rotate(55.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="32"] {
	transform: rotate(57.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="33"] {
	transform: rotate(59.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="34"] {
	transform: rotate(61.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="35"] {
	transform: rotate(63deg);
	animation: rotate 1s linear;
}

.arc[data-value="36"] {
	transform: rotate(64.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="37"] {
	transform: rotate(66.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="38"] {
	transform: rotate(68.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="39"] {
	transform: rotate(70.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="40"] {
	transform: rotate(72deg);
	animation: rotate 1s linear;
}

.arc[data-value="41"] {
	transform: rotate(73.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="42"] {
	transform: rotate(75.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="43"] {
	transform: rotate(77.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="44"] {
	transform: rotate(79.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="45"] {
	transform: rotate(81deg);
	animation: rotate 1s linear;
}

.arc[data-value="46"] {
	transform: rotate(82.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="47"] {
	transform: rotate(84.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="48"] {
	transform: rotate(86.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="49"] {
	transform: rotate(88.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="50"] {
	transform: rotate(90deg);
	animation: rotate 1s linear;
}

.arc[data-value="51"] {
	transform: rotate(91.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="52"] {
	transform: rotate(93.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="53"] {
	transform: rotate(95.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="54"] {
	transform: rotate(97.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="55"] {
	transform: rotate(99deg);
	animation: rotate 1s linear;
}

.arc[data-value="56"] {
	transform: rotate(100.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="57"] {
	transform: rotate(102.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="58"] {
	transform: rotate(104.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="59"] {
	transform: rotate(106.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="60"] {
	transform: rotate(108deg);
	animation: rotate 1s linear;
}

.arc[data-value="61"] {
	transform: rotate(109.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="62"] {
	transform: rotate(111.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="63"] {
	transform: rotate(113.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="64"] {
	transform: rotate(115.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="65"] {
	transform: rotate(117deg);
	animation: rotate 1s linear;
}

.arc[data-value="66"] {
	transform: rotate(118.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="67"] {
	transform: rotate(120.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="68"] {
	transform: rotate(122.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="69"] {
	transform: rotate(124.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="70"] {
	transform: rotate(126deg);
	animation: rotate 1s linear;
}

.arc[data-value="71"] {
	transform: rotate(127.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="72"] {
	transform: rotate(129.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="73"] {
	transform: rotate(131.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="74"] {
	transform: rotate(133.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="75"] {
	transform: rotate(135deg);
	animation: rotate 1s linear;
}

.arc[data-value="76"] {
	transform: rotate(136.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="77"] {
	transform: rotate(138.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="78"] {
	transform: rotate(140.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="79"] {
	transform: rotate(142.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="80"] {
	transform: rotate(144deg);
	animation: rotate 1s linear;
}

.arc[data-value="81"] {
	transform: rotate(145.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="82"] {
	transform: rotate(147.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="83"] {
	transform: rotate(149.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="84"] {
	transform: rotate(151.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="85"] {
	transform: rotate(153deg);
	animation: rotate 1s linear;
}

.arc[data-value="86"] {
	transform: rotate(154.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="87"] {
	transform: rotate(156.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="88"] {
	transform: rotate(158.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="89"] {
	transform: rotate(160.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="90"] {
	transform: rotate(162deg);
	animation: rotate 1s linear;
}

.arc[data-value="91"] {
	transform: rotate(163.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="92"] {
	transform: rotate(165.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="93"] {
	transform: rotate(167.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="94"] {
	transform: rotate(169.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="95"] {
	transform: rotate(171deg);
	animation: rotate 1s linear;
}

.arc[data-value="96"] {
	transform: rotate(172.8deg);
	animation: rotate 1s linear;
}

.arc[data-value="97"] {
	transform: rotate(174.6deg);
	animation: rotate 1s linear;
}

.arc[data-value="98"] {
	transform: rotate(176.4deg);
	animation: rotate 1s linear;
}

.arc[data-value="99"] {
	transform: rotate(178.2deg);
	animation: rotate 1s linear;
}

.arc[data-value="100"] {
	transform: rotate(180deg);
	animation: rotate 1s linear;
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}
}


.semi-circle-graph {
	width: 350px;
	height: calc(350px / 2);
	position: relative;
	color: #ddd;
	font-size: 22px;
	font-weight: 600;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	overflow: hidden;
	box-sizing: border-box;
}

.semi-circle-graph:before {
	content: "";
	width: 350px;
	height: calc(350px / 2);
	border: 50px solid rgba(0, 0, 0, 0.15);
	border-bottom: none;
	position: absolute;
	box-sizing: border-box;
	transform-origin: 50% 0%;
	border-radius: 300px 300px 0 0;
	left: 0;
	top: 0;
}

.semi-circle-graph-data {
	width: 350px;
	height: calc(350px / 2);
	border: 50px solid var(--fill);
	border-top: none;
	position: absolute;
	transform-origin: 50% 0% 0;
	border-radius: 0 0 350px 350px;
	left: 0;
	top: 100%;
	z-index: 5;
	animation: 1s fillGraphAnimation ease-in;
	transform: rotate(calc(1deg * var(--percentage) * 1.8));
	box-sizing: border-box;
	cursor: pointer;
}

.semi-circle-graph-data:after {
	content: attr(data-name) " " counter(varible) "%";
	counter-reset: varible var(--percentage);
	background: var(--fill);
	box-sizing: border-box;
	border-radius: 2px;
	color: #fff;
	font-weight: 200;
	font-size: 12px;
	height: 20px;
	padding: 3px 5px;
	top: 0px;
	position: absolute;
	left: 0;
	transform: rotate(calc(-1deg * var(--percentage) * 1.8)) translate(-30px, 0px);
	transition: 0.2s ease-in;
	transform-origin: 0 50% 0;
	opacity: 0;
}

@keyframes fillAnimation {
	0% {
		transform: rotate(-45deg);
	}

	50% {
		transform: rotate(135deg);
	}
}

@keyframes fillGraphAnimation {
	0% {
		transform: rotate(0deg);
	}

	50% {
		transform: rotate(180deg);
	}
}


/* Tags */
.tag-container {
	clear: both;
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 10px 0 16px;
	flex-wrap: wrap;
}

.tag-container.details {border-bottom: 1px solid #ddd; padding: 0 0 24px}

.tag-container .tag {
	box-sizing: border-box;
	background: #f5f5f5;
	border-radius: 8px;
	padding: 5px 14px;
	font-size: 12px;
	color: #333;
	text-transform: uppercase;
	display: flex;
	justify-content: center;
	gap: 8px;
	position: relative;
	overflow: hidden;
	transition: color 0.3s ease-in-out;
	cursor: default;
	min-width: 55px;
}

.tag-container .tag span {
	width: 15px;
	height: 15px;
	display: grid;
	place-content: center;
	transition: filter 0.3s ease-in-out,opacity 0.3s ease-in-out;
	fill: #fff;
	position: absolute;
	left: 6px;
	opacity: 0;
	background: transparent;
}

.tag-container .tag span.edit-tag {
	left: inherit;
	right: 6px;
}

.tag-container .tag i {
	width: 6px;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	transition: width 0.3s ease-in-out;
}

.ui-widget input {
	width: 200px;
}

.tag-container .tag.edicao span, .tag-container .tag.edicao i {
	cursor: pointer
}

.tag-container .tag.edicao:hover i {
	width: 27px
}

.tag-container .tag.edicao:hover span {
	opacity: 1
}

	.tag-container .tag.edicao:hover span:hover {
		filter: brightness(155%)
	}

.tag-container .tag.edicao:hover {
	color: #e2e2e2
}

.tag-container.grupo {
	margin: 0 0 20px
}

.input-autocomplete {
	position: relative
}

.tag-container .tag i.edit-tag {
	width: 0;
	background-color: #c4c4c4;
	left: inherit;
}

.input-autocomplete .ui-autocomplete {
	top: 25px !important;
	min-width: 150px;
	background: #fff;
	color: #333;
	border: 1px solid #bebebe;
	z-index: 999 !important;
	border-radius: 5px;
	padding: 0;
}

.input-autocomplete .ui-menu .ui-menu-item a, .input-autocomplete .ui-menu .ui-menu-item .ui-menu-item-wrapper {
	line-height: 2;
	cursor: pointer;
	padding: 0 6px;
}

.input-autocomplete .ui-menu .ui-menu-item a:hover, .input-autocomplete .ui-menu .ui-menu-item .ui-menu-item-wrapper:hover, .input-autocomplete .ui-menu .ui-menu-item .ui-menu-item-wrapper.ui-state-active {
	background-color: #efefef;
	border: none;
	color: #333;
	border: 1px solid #efefef;
	font-weight: 500;
}

.input-autocomplete .ui-menu .ui-menu-item div {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* number of lines to show */
	line-clamp: 1;
	-webkit-box-orient: vertical;
}

.simplemodal-wrap, .simplemodal-wrap > div, .simplemodal-wrap > div > iframe {
	width: 100%;
	height: 100%
}

#create-tag input {
	width: 100%;
	box-sizing: border-box
}

.input-color {
	padding: 0
}

.color-select {
	display: flex;
	gap: 16px;
	margin: 0 0 16px 0
}

	.color-select > div {
		flex: 1 1 50%
	}

.group-field {
	position: relative;
	box-sizing: border-box;
	margin: 0 0 16px;
	border-radius: 6px;
	border: 1px solid #ddd;
	overflow: hidden;
}

	.group-field .group-field-input {
		box-sizing: border-box;
		width: 100%;
		outline: 0;
		border: 0;
		padding: 5px 10px;
	}

		.group-field .group-field-input::-webkit-input-placeholder {
			opacity: 0.5
		}

	.group-field .group-field-btn {
		box-sizing: border-box;
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		background: #ddd;
		width: 200px;
		display: grid;
		place-content: center;
		transition: background-color 0.5s ease-in-out;
		outline: 0;
		border: 0;
		cursor: pointer;
	}

#area-filtro {
	display: flex;
	gap: 16px;
}

	#area-filtro form {
		width: 100%
	}

.neutral-button {
	box-sizing: border-box;
	background-color: #ddd;
	color: #333;
	width: 165px;
	height: 26px;
	border-radius: 5px;
	font-size: 13px;
	text-transform: uppercase;
	display: grid;
	place-content: center;
	transition: background-color 0.5s ease-in-out;
	outline: none;
	border: none;
}

.neutral-button:hover, .group-field .group-field-btn:hover {
	background-color: #b7b7b7;
	color: inherit;
}

.neutral-button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.title-area {
	display: flex;
	gap: 16px;
	align-items: center;
}

	.title-area h3 {
		padding: 0 !important
	}

	.title-area .neutral-button, #hide-estimate {
		width: 25px;
		height: 25px
	}

.form-field {
	width: 500px;
}

.form-label {
	font-size: 12px;
	margin: 0 0 4px 0;
}

.form-select:focus, .form-control:focus {
	outline: none;
	border-color: unset;
	box-shadow: none;
}

#detail-menu a.listItemSubtitle:hover {
	backdrop-filter: brightness(95%);
	background: initial;
	color: inherit !important;
}

.grid-iteration {
	display: grid;
	gap: 16px;
	align-items: center;
	grid-template-columns: 250px 250px 285px 200px auto;
	margin: 6px 0;
	border-bottom: 1px solid #eaeaea;
	position: relative
}
.grid-iteration:last-child {border-bottom: none;}
.grid-iteration .capacity-input {font-size: 16px}

.list-title {
	list-style: none;
	height: 30px;
	border-bottom: 1px solid #eaeaea;
}

.list-title-item {font-size: 12px;}

.grid-table {display: grid; grid-template-columns: 175px 12px minmax(515px, auto) 150px 205px 100px 100px; gap: 8px;}
.grid-sub-table {display: grid; grid-template-columns: 175px 12px minmax(515px, auto) 150px 205px 100px 100px 150px; column-gap: 8px}
.grid-table.product-backlog, .grid-sub-table.product-backlog {grid-template-columns: 175px 12px minmax(515px, auto) 150px 205px 100px 100px 150px}
.grid-body .icon-svg {
	position: absolute;
	top: 6px;
	left: 4px;
	cursor: pointer;
	padding: 5px;
}
.grid-body .icon-svg svg, .neutral-button svg {transition: transform 0.3s ease-in-out; transform: rotate(-90deg);}
.grid-table p {padding: 0;}
.grid-table.grid-head {height: 30px; margin: 16px 0 0 0; margin: 12px 0 8px;}
.grid-table.grid-head p {font-weight: 900; font-size: 12px}
.grid-container .grid-body {background-color: #f4f4f4; margin: 0 0 8px 0; position: relative}
.grid-body .grid-table {height: 35px;}
.grid-body .grid-table:hover {border-bottom: 1px solid #919191}
.grid-body p {font-size: 14px; cursor: default; height: 35px;}
.grid-body .grid-sub-table p {font-size: 12px; height: 25px}
.grid-body .droppable-subarea {list-style: none; padding: 0; overflow: hidden; height: 0}
.grid-body .droppable-subarea li {padding: 0; /*border-bottom: 1px solid #c4c4c4;*/ font-size: 12px; backdrop-filter: brightness(0.95); margin: 4px 0;}
.grid-body .droppable-subarea li:last-child {border: none}

.grid-body .droppable-subarea .draggable-item .icon-svg {top: 0}

.grid-body.ativo .droppable-subarea {height: fit-content}
.grid-body.ativo p {font-size: 11px}
.grid-body.ativo .link-task p:first-child {font-size: 14px}

.subarea-feature, .subarea-backlog, .subarea-task {grid-column: 1/8; height: 0}
.subarea-feature.ativo, .subarea-backlog.ativo, .subarea-task.ativo {height: fit-content}

.grid-body.ativo .icon-svg svg, .neutral-button.ativo svg, .icon-svg.ativo svg {transform: rotate(0)}
.grid-body.ativo .grid-table {border-bottom: 1px solid #919191}
.link-task.card {display: none}
.link-task {padding: 0 0 0 32px}
.link-task.card .tasks-agrupadas {
	width: 30px; 
	height: 30px;
	display: grid;
	place-content: center;
	border-radius: 50%;
	background-color: #ddd;
	position: absolute;
	right: 0;
	bottom: 0;
	transform: translateY(40px);
	cursor: pointer;
	transition: background-color 0.5s ease-in-out;
}
.link-task.card .tasks-agrupadas:hover {
	background-color: #b7b7b7;
	color: inherit;
}

.subarea-feature .draggable-item {padding-left: 10px !important }
.subarea-backlog .draggable-item {padding-left: 20px !important; border-bottom: 1px solid #d7d7d7 }
.grid-body .subarea-feature .icon-svg {left: 15px !important;}
.grid-body .subarea-backlog .icon-svg {left: 20px !important}

.badge {font-size: 10px; text-transform: uppercase; height: 20px; display: inline-flex; align-items: center; gap: 4px}
.badge.mini {height: 15px;}
.badge img {width: 12px;}
.badge.idx {background-color: #f3f3f3; color: #333; width: 20px}
.badge.mini:empty {display: block}

/* Cores badge.*/
.New {background-color: #cd5792}
.Approved {background-color: #f37326}
.Committed {background-color: #905e97}
.InProgress {background-color: #ffcf6b; color: #333333}
.Staging {background-color: #9f8772}
.Done {background-color: #4db34d}
.ToDo {background-color: #557cbe}
.Canceled {background-color: #686868}
.Readed {background-color: #820000}
.QA {background-color: #d454e8}

.trello {background-color: unset !important; display: grid; grid-template-columns: 30px 200px auto; gap: 16px}
.trello .link-task {display: none !important;}
.trello .link-task.card {display: flex !important;}
.trello .droppable-subarea {display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;}
.trello .card {height: 120px; overflow: hidden }
.trello .link-task.card {overflow: visible}
.trello .card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	grid-template-rows: repeat(auto-fill, 120px);
	gap: 4px;
	background: #f1f1f1;
	padding: 8px;
	min-height: 270px;
	position: relative
}
.trello .card-grid a { text-align: left }

.trello-head {display: none}
.trello-head.ativo{display: grid}
.trello-head p {grid-column: 3; text-align:center; font-weight: 700}

.card-grid.has-scroll #new_mission .btn-container {
	bottom: inherit;
	top: -40px
}


.card {
	border: 1px solid #f4f4f4;
	background-color: #fff;
	border-radius: 6px;
	padding: 12px;
	display: flex;
	gap: 6px;
	flex-direction: column;
}
.card p {height: fit-content; padding: 0; gap: 8px}
.card p:nth-child(2) {min-height: 13px}
.card .icons {min-height: 23px}
.card-grid .card p:first-child { height: 26px }
.card p .card-label {font-size: 11px}


.truncate {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box !important;
	-webkit-line-clamp: 2; /* number of lines to show */
	line-clamp: 2;
	-webkit-box-orient: vertical;
}

.truncate-sm {
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 1; /* number of lines to show */
	line-clamp: 1;
	-webkit-box-orient: vertical;
}

.truncate-xl {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 130px;
}
.backlog-link { max-width: none }

#not-iteration-warning {font-size: 14px; margin: 12px 0 0}
.modal input {width: 100%}
.input-dias {width: 75px !important; font-size: 16px !important; text-align: center}

.jqibox {z-index: 9999 !important}

.delete-icon {
	height: 14px;
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	fill: #db3232;
	cursor: pointer;
	transition: fill 0.5s ease-in-out;
}

.delete-icon:hover {fill: #b11818}



/* styles during drag */
tr .draggable-item.ui-sortable-placeholder {
	border: 2px dashed #ccc;
}

.select-field {width: 100%}

.dependency-container {display: grid;grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 8px}
.dependency-container .card {position: relative; overflow: hidden; border-color: #ddd}
.dependency-container .card i {
	position: absolute;
	right: 0;
	height: 100%;
	background: #f4f4f4;
	width: 0;
	transition: width 0.3s ease-in-out;
}
.dependency-container .card .delete-icon {position: absolute; height: 20px; width: 20px; display: grid; place-content: center; top: 20px; right: 10px; visibility: hidden; opacity: 0; transition: background 0.3s ease; border-radius: 5px}
.dependency-container .card {gap: 10px}
.dependency-container .card:hover i {width: 40px}
.dependency-container .card:hover .delete-icon {animation: show-visibility 0.3s ease-in-out 0.2s both; visibility: visible}
.dependency-container .card:hover .delete-icon:hover {background: #ccc}
.dependency-container .card p, .dependency-container .card a {font-size: 12px; color: #333}
.dependency-container .card a:hover {color: #e17611}
.dependency-container .card .status p {font-size: 11px; white-space: nowrap}
.dependency-container .card .status p span {font-size: 10px;}
.dependency-container .card p .mini {height: 8px; width: 8px; border-radius: 50%; padding: 0}
.dependency-container .card .card-date {color: #ccc; font-size: 10px; white-space: nowrap}
.user-task::before { content: ""; position: absolute; top: 0; left: 0; height: 100%; width: 4px; background-color: #4F7ED1 }
.card-grid .card {opacity: 0.6}
.card-grid .card.user-task { opacity: 1 }

@keyframes show-visibility {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.btn-group label.btn {background-color: #ededed; border-color: #fdfdfd; line-height: 30px; padding: 0 32px; margin: 0;}
.btn-group label.btn:hover {background-color: #a5a4a4 !important; color: inherit !important; border-color: #fdfdfd !important}
.btn-group :checked + label.btn {background-color: #ccc; color: #333; border: none}
.btn-check:checked + .btn, :not(.btn-check) + .btn:active, .btn:first-child:active, .btn.active, .btn.show {border-color: #ededed !important;}

/*** DROPDOWN SCRUM ***/
#scrum-atual {font-weight: 900}
.backlog-icon {width: 18px; margin: 0 8px 0 0}

@media (min-width: 576px) {
	.modal-dialog {
		min-width: 300px !important;
		max-width: fit-content !important
	}
}

/* Detalhes do projeto. */
.details-container {display: grid; grid-template-columns: 9fr 375px; gap: 16px}
.neutral-button.icon {width: 40px; height: 40px; transition: filter 0.3s ease-in-out}
.neutral-button.icon:hover {filter: brightness(0.9)}
.neutral-button.cancel {background-color: #adb5bd}
.neutral-button.edit {background-color: #fdd85d}
.neutral-button.finish {background-color: #6a994e}

.details-container .detail-label {color: #777; font-weight: 700;}
.details-container .detail-field {}
.details-container textarea {width: 100% !important}
.details-container .details-grid {
	display: grid;
	grid-template-columns: 1fr 470px;
	gap: 40px;
}

@media screen and (min-width: 1600px) {
	.details-container .details-grid {grid-template-columns: 1fr 610px;}
}

.grid-head.work-items, .grid-body.work-items {display: grid; grid-template-columns: 100px repeat(3, 150px) 15px auto 115px 125px 100px; gap: 8px; transition: background-color 0.4s ease-in-out}
.grid-head.work-items, .grid-body.work-items p {font-size: 12px}
.grid-head.work-items, .grid-body.work-items p.deadline {line-height: 12px}
.grid-body.work-items p {cursor: pointer}
.grid-body.work-items:hover {background-color: #e1e1e1;}

#search-project, #search-participant, #filtro-board { position: relative }
#search-project svg, #search-participant svg, #filtro-board svg { position: absolute; right: 8px; top: 50%; transform: translateY(-50%)}
.select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single, #filtro-board input {
	/*
	background-color: #f7f7f7 !important;
	border: none !important;
	*/
	border: 1px solid #d5d5d5 !important;
	border-radius: 5px !important;
	padding: 0 36px 0 8px !important;
	display: flex !important;
	align-items: center;
	height: fit-content !important;
	min-height: 35px !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
	background-color: #d5d5d5 !important; /* #b2b2b2 */
	border: none !important;
	max-width: 100px !important;
	margin: 0 !important;
	flex: 1 1 75px;
}

#filtro-board {width: 300px}
.select2-container .select2-selection--multiple .select2-selection__rendered {display: flex !important; flex-wrap: wrap; gap: 5px}
.select2-container--default .select2-selection--multiple .select2-selection__choice__display {padding-left: 8px !important}
.select2-dropdown {background-color: #f7f7f7 !important; border: none !important; border-radius: 5px !important; box-shadow: 3px 3px 2px #959595;}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {color: #767676 !important}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {background-color: #959595 !important}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus {
	background-color: inherit !important;
	color: inherit !important;
	backdrop-filter: brightness(0.9);

}
.select2-container--default .select2-search--dropdown .select2-search__field {border-color: #ccc; border-radius: 5px; background-color: #fdfdfd;}
.select2-container--default .select2-selection--single .select2-selection__arrow {display: none !important}
.select2-results__option--selectable, .select2-container--default .select2-selection--multiple .select2-selection__choice__display {
	font-size: 14px
}
.select2-container--default .select2-search--inline .select2-search__field {min-width: 4rem}

.form-btn {
	height: 35px;
	width: 35px;
	background-color: #0095b8;
	border-radius: 5px;
	padding: 0 !important;
	transition: background-color 0.4s ease-in-out;
}
.form-btn:hover {background-color: #02708b}

.pagination a {background-color: #f4f4f4; padding: 6px; border-radius: 6px; transition: background-color 0.4s ease-in-out}
.pagination a:hover {background-color: #dcdcdc;}
.pagination a.disabled {pointer-events: none; cursor: default; opacity: 0.4}

#sprint-backlog { display: grid; gap: 16px; grid-template-columns: 9fr 3fr; }
#sprint-backlog p { padding: 0 }
#sprint-backlog .work-section { border-bottom: 1px solid #ccc; margin: 0 0 8px 0 }
#sprint-backlog .work-section img { border-radius: 50%; width: 25px }
#sprint-backlog .work-section:last-child { border-bottom: none; }
#sprint-backlog .work-section .work-bar { height: 20px; border: 1px solid #ccc; width: var(--barra); position: relative }
#sprint-backlog .work-section .work-bar::before { content: ""; position: absolute; right: 0; width: 3px; height: 100%; background-color: #ccc }
#sprint-backlog .work-section .work-bar .estimativa { position: absolute; height: 100%; width: var(--tamanho); background-color: #4DB34D }
#sprint-backlog .work-section .work-bar .estouro { position: absolute; height: 100%; width: var(--estouro); background-color: #cd5792; right: 0 }
#sprint-backlog .work-section .work-title { font-weight: 800; color: #555; margin: 0 0 6px }

#nav-buttons .form-btn { background-color: #f7f7f7 }
#nav-buttons .form-btn:hover { background-color: #cdcdcd }
#nav-buttons a.ativo { pointer-events: none; background-color: #0095b8 }

#board-view {grid-template-columns: repeat(3, 1fr); height: calc(100vh - 305px);}
#board-view.pbi {grid-template-columns: repeat(7, 1fr);}
#board-view.unique {height: calc(100vh - 320px);}
#board-view .card-grid { 
	height: 100%;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	/*grid-template-rows: 25px repeat(auto-fill, 120px);*/
	align-items: center;
	border-radius: 10px;
}

	#board-view.pbi .card-grid {
		grid-template-columns: 1fr
	}

.card-grid .card.highlight { box-shadow: 4px 4px 3px #091e4214 }
.users-area img { width: 23px; border-radius: 50% }

.card-grid { scrollbar-width: thin; scrollbar-color: #a1a1a1 #091e4214; }

.card-grid .trello-label {
	/*grid-column: 1 / 3;*/
	color: #a1a1a1;
	text-transform: uppercase;
	text-align: center;
	padding: 0;
	font-weight: 800;
	/*
//position: sticky !important;
//top: -10px;
//height: 30px;
//background-color: #f1f1f1;
	*/
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	width: 100%;
	top: 0;
	padding:16px 0 8px;
	background-color: #f1f1f1;
}

/*@media screen and (min-width: 1440px) {
	.card-grid .trello-label { grid-column: 1 / 4 }
}*/

.card-grid::-webkit-scrollbar {width:8px}
.card-grid::-webkit-scrollbar-track { background-color: #091e4214 }
.card-grid::-webkit-scrollbar-thumb { background-color: #a1a1a1; border-radius: 10px }

#board-view.pbi .card-grid .trello-label {grid-column: initial}
.droppable-subarea .ui-selected {
	background: red;
	color: white;
	font-weight: bold;
}

.card-placeholder { background-color: #091e4214; border: 2px dashed #ccc; width: 100%; height: 100%; min-height: 65px }

.dropdown-menu.board.has-tip::after {top: -5px !important;} 
.dropdown-menu.board.has-tip::before {top: -6px !important;}

#inputHora {background-color: #fff; padding: 6px; width: 70px; text-align: center; border-radius: 6px;}

.caligrafico {
	background-color: var(--background);
	width: 23px;
	height: 23px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.caligrafico span {
	color: var(--color);
	filter: invert(100%);
	font-weight: 900;
	font-size: 11px;
}

input:invalid { border-color: #CC5792; background-color: #CC579210; }
input:focus, select:focus {outline: none;border: 1px solid #0095b8}

.dashboard-img {max-width: 15px; max-height: 15px}

#simple-create { padding: 0 4px }
#simple-create  textarea { resize: none }
#simple-create .task-content { border-bottom: 1px solid #ccc; padding: 0 0 10px 0; }
#simple-create .task-content:last-child { border-bottom: none }
#simple-create .pbi-child { padding: 0 0 0 71px;}
#simple-create a.neutral-button { max-width: 27px; height: 27px; }
#simple-create a.neutral-button svg { transform: rotate(0) }
#simple-create a.neutral-button.delete { background-color: #db3232; }
#simple-create .badge { height: 27px; font-size: 12px; max-width: 55px; justify-content: center }

#task-assigned { max-height: 285px; min-height: 340px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #a1a1a1 #091e4214; padding: 0 8px 0 0}
#task-assigned::-webkit-scrollbar {width:6px}
#task-assigned::-webkit-scrollbar-track { background-color: #091e4214; }
#task-assigned::-webkit-scrollbar-thumb { background-color: #a1a1a1; border-radius: 10px; }

.status #inputSelect { width: 135px; font-size: 12px}
#inputSelect { font-size: 12px }

.attached-files .attach-icon { width: 25px; height: 25px; display: grid; place-content: center; background-color: #ccc; border-radius: 6px; transition: background-color 0.3s ease-in-out }
.attached-files .attach-icon.disabled { opacity: 0.5; pointer-events: none }
.attached-files .attach-icon svg { fill: #333; width: 15px; }
.attached-files .attach-icon:hover { background-color: #e17611 }
.attached-files .attach-icon:hover:last-child { background-color: #0095b8 }

#visualizarImagem img { max-width: 1080px; }

.modalFiles { display: flex; align-items: center }

#attachLink { margin: 0 0 12px 0 }

.validation-summary { width: fit-content; padding: 10px; border-radius: 12px; border: 1px solid green; }
.validation-summary p { font-size: 13px }
.validation-summary.success { background-color: #4db34d50; border: 1px solid #4db34d; }
.validation-summary.danger { background-color: #cd579250; border: 1px solid #cd5792; }
.validation-summary.warning { background-color: #ffcf6b50; border: 1px solid #ffcf6b; }
.validation-summary.info { background-color: #557cbe50; border: 1px solid #557cbe; }

#detail-menu .drop-button.ativo {background-color: #0095b8}
#detail-menu .drop-button.ativo svg {fill: #fff}

#timeline-slide #sprintDay {color: #0095b8; border: 0; font-weight: 900}
#timeline-slide .ui-state-active {border: 1px solid #0095b8;background: #03748f !important;font-weight: normal;color: #ffffff;}
#timeline-slide .ui-state-default {background: #0095b8}

#loader {color: #0095b8}

#hide-estimate svg {transform: none}

.estimate-hour.esconder {opacity: 0}
.estimate-hour.mostrar {opacity: 1}

.miniatura-container {
	width: 355.55px;
	height: 200px;
	background: #e8e8e8;
	display: grid;
	place-content: center;
	margin: 16px 0;
}

.miniatura-container img {
	max-width: 100%;
	max-height: 200px;
}

#miniatura-anexos {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 12px 0 0 0;
}

#miniatura-anexos img {
	flex: 1 1 185px;
	max-width: 185px;
	box-shadow: 2px 2px 3px rgba(0,0,0,0.1)
}

.modal-iframe {
	height: 400px;
	width: 550px
}

.modal-iframe iframe {
	width: 100%;
	height: 100%
}

#iframe-anexos {
	display: grid;
	grid-template-rows: auto 1fr auto;
	height: 368px;
}

#iframe-anexos .anexos {
	overflow: auto
}

#tags::placeholder {
	opacity: 0.4
}

.form-div {
	font-size: 11px
}

.editor-field input, .editor-field textarea, .editor-field select {
	/*background-color: #f7f7f7;*/
	border: 1px solid #d5d5d5;
	border-radius: 5px;
	padding: 5px;
	height: fit-content;
	min-height: 35px;
	transition: background-color 0.3s
}
.editor-field input:hover, .editor-field textarea:hover, .editor-field select:hover {background-color: #f2f2f2;}
.editor-field input:focus, .editor-field textarea:focus, .editor-field select:focus {border: 1px solid #ddd}
.editor-field input:focus-visible, .editor-field textarea:focus-visible, .editor-field select:focus-visible {outline: none !important}

input[disabled="disabled"], textarea[disabled="disabled"], select[disabled="disabled"] {background-color: #f4f4f4}
input[readonly] {background: #f7f7f7}
#custom_date {cursor: pointer}

#content .chart-filter .other-button {height: 35px}

#menu #search form input[type="text"] {
	border-left: 1px solid #d5d5d5;
	border-top: 1px solid #d5d5d5;
	border-bottom: none;
	border-radius: 5px 0 0 0;
	height: 35px;
}
#menu #search form a {
	border: none;
	background-color: #d5d5d5;
	border-radius: 0 5px 0 0;
	height: 35px;
	width: 35px;
	transition: background-color 0.3s ease
}
#menu #search form a:hover { background-color: #c3c3c3 }

/* MISSÕES INDIVIDUAIS */

.responsive-board {
	overflow-x: auto;
	padding-bottom: 10px;
}

	.responsive-board ::-webkit-scrollbar {
		width: 8px;
	}

	.responsive-board ::-webkit-scrollbar-track {
		background-color: #091e4214;
	}

	.responsive-board ::-webkit-scrollbar-thumb {
		background-color: #a1a1a1;
		border-radius: 10px;
	}

#board-view.missoes {
	display: flex;
	height: calc(100vh - 325px);
}

#board-view.missoes .card-grid {
	min-width: 300px !important;
	max-width: 300px !important;
	width: 300px !important;
	height: 100%;
	/*position: relative;*/
	display: flex;
	flex-direction: column;
	/*overflow-y: hidden;*/
	/*overflow-x: hidden !important;*/
}

#board-view.missoes .card-grid .cards-wrapper {
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.temp-padding {padding-bottom: 100px !important}
.temp-overflow {overflow-y: unset !important}
.temp-overflow-hidden {overflow-y: hidden !important}

#board-view.missoes .card-grid .card-mission {
	opacity: 1;
	width: 100%;
	position: relative;
	padding-left: 48px;
	display: block;
	height: initial;
	cursor: pointer;
	min-height: 61px
}

#board-view.missoes .card-grid .card-mission i {
	position: absolute;
	right: 12px;
	top: 12px;
	padding: 10px;
	border-radius: 6px;
	background-color: #c5c5c5;
	z-index: 10;
	opacity: 0;
	transition: opacity 0.35s ease;
	transition-delay: 0.05s;
	stroke: #333;
}


#board-view.missoes .card-grid .card-mission::after {
	content: "";
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	background-color: rgba(0, 0, 0, 0.1);
	opacity: 0;
	transition: opacity 0.35s ease;
}

#board-view.missoes .card-grid .card-mission:hover::after {
	opacity: 1;
}

#board-view.missoes .card-grid .card-mission:hover i {
	opacity: 1;
}

#board-view.missoes .card-grid .card-mission .mission-desc {
	font-size: 13px;
	height: initial;
	resize: none;
	padding: 0;
	overflow: hidden
}

#board-view.missoes .card-grid .card-mission .btn-container {
	display: none;
	position: absolute;
	bottom: -40px;
	left: 0;
	/*padding: 10px 30px;*/
	font-size: 13px;
}

#board-view.missoes .card-grid .card-mission .btn-container button {
}

#board-view.missoes .card-grid .card-mission .mission-icon {
	position: absolute;
	top: 0;
	left: 0;
	background: var(--bg);
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 8px;
}

#board-view.missoes .card-placeholder {
height: 50px;
}

#board-view.missoes .card-grid .card-mission[data-s="0"] {
	padding: 12px 12px 12px 48px;
}

#board-view.missoes .card-grid .user-img {
/*position: absolute;*/
top: 10px;
right: 10px;
z-index: 10;
width: 30px;
border-radius: 50%;
}

#board-view.missoes .card-header {
	position: sticky;
	top: 0;
	z-index: 5;
	background-color: #f1f1f1;
	display: flex;
	justify-content: space-between;
	width: 100%;
	align-items: center;
	margin-bottom:16px
}


#board-view.missoes .card-header::before {
	content: '';
	position: absolute;
	background-color: #f1f1f1;
	width:290px;
	height: 200%;
	left: 50%;
	transform: translateX(-50%)

}
	

#board-view.missoes .card-grid .add-icon {
	/*position: absolute;*/
	top: 10px;
	left: 10px;
	z-index: 10;
	width: 30px;
	aspect-ratio: 1;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.35s;
	cursor: pointer;
}

#board-view.missoes .card-grid .add-icon:hover {
background-color: rgba(0, 0, 0, 0.1);
}

/*

#board-view.missoes .card-grid .trello-label {
margin-bottom: 16px;
}
*/

.float-submenu {
	display: none;
	position: absolute;
	left: 0;
	top: -40px
	/*top: 20px;*/
}

.float-submenu ol {
	list-style: none;
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.float-submenu ol li {
	background-color: #2c333a;
	border-radius: 4px;
	padding: 4px 8px;
	font-size: 13px;
	color: #fff;
	transition: background-color .35s ;
	white-space: nowrap
}

.float-submenu ol li:hover {
	background-color: #454f59
}

.float-submenu ol li .nav-submenu {
	display: none;
	max-height: 120px;
	overflow-y: auto;
}

.float-submenu ol li .nav-submenu li {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	gap: 8px;
	white-space: inherit
}

.float-submenu ol li .nav-submenu li svg {
	position: relative;
	z-index: 10;
	min-width: 15px
}

.float-submenu ol li .nav-submenu li::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 16px;
	background-color: var(--bg);
}

#board-view.missoes .card-grid .card-mission.edit {
	position: relative;
	z-index: 150;
	overflow: visible;
	min-height: 120px;
	border: none;
}

	#board-view.missoes .card-grid .card-mission.edit::after,
	#board-view.missoes .card-grid .card-mission.edit i {
		display: none;
	}

#board-view.missoes .card-grid .card-mission.edit .mission-icon {
	border-radius: 6px 0 0 6px;
}

.backdrop-board {
	position: fixed;
	width: 100vw;
	height: 100vh;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 100;
	cursor: default;
	display: none;
}

.mission-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	grid-template-rows: repeat(auto-fill, 120px);
	gap: 4px;
	background: #f1f1f1;
	padding: 8px;
	min-height: 270px;
}

.jq-toast-heading {
	font-weight: bold !important
}

.grid-arquivadas {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 12px;
}

.grid-arquivadas .item-arquivadas {
	background-color: #f1f1f1;
	border-radius: 8px;
	overflow: hidden;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 1rem
}

.grid-arquivadas .item-arquivadas p {
	font-size: 16px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1;
}

.grid-arquivadas .item-arquivadas span {
	color: #a1a1a1;
	font-size: 10px;
	font-style: italic;
	display: block
}

.grid-arquivadas .item-arquivadas .icon-btn {
	height: 35px;
	width: 35px;
	border-radius: 5px;
	padding: 0 !important;
	transition: background-color 0.4s ease-in-out;
}

.grid-arquivadas .item-arquivadas .icon-btn:hover {
	background-color: rgba(0, 0, 0, 0.1)
}

.grid-arquivadas .item-arquivadas .user-img {
	border-radius: 50%;
	border-radius: 35px;
	position: relative;
	z-index: 5
}

.grid-arquivadas .item-arquivadas .img-container {
	position: relative
}

.grid-arquivadas .item-arquivadas .img-container::after {
	content: '';
	height: calc(100% + 16px);
	background-color: var(--bg);
	position: absolute;
	left: -8px;
	top: -8px;
	width: calc(50% + 8px);
}

.grid-arquivadas .item-arquivadas .img-container .icon {
	aspect-ratio: 1;
	border-radius: 50%;
	background: var(--bg);
	position: absolute;
	z-index: 6;
	right: 0;
	bottom: -4px;
	width: 20px;
}

.grid-arquivadas .item-arquivadas .img-container .icon svg {
	width: 12px
}

#board-view.qt .card-grid {
	/*overflow: auto;*/
	padding-top: 48px
}

.overflow-y {
	overflow-y: auto !important
}

.overflow-hidden {
	overflow-y: hidden !important
}

#archivedModal .modal-dialog {
	max-width: 90vw !important;
	max-height: 90vh !important
}

#board-view.workItems .card-grid {
	display: flex;
	flex-direction: column;
}

#board-view.workItems .card-grid .cards-wrapper {
	overflow-y: auto;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	grid-template-rows: repeat(auto-fill, 120px);
	gap: 4px;
}

.cards-wrapper::-webkit-scrollbar {width: 8px}
.cards-wrapper::-webkit-scrollbar-track {background-color: #091e4214}
.cards-wrapper::-webkit-scrollbar-thumb {background-color: #a1a1a1;border-radius: 10px}

#content table.new-table {
	margin: 0;
	outline: 4px solid #e4e4e4;
	border-radius: 10px;
}

#content table.new-table tr {
	height: 48px;
	outline: 1px solid #e4e4e4;
}

#content table.new-table th {
	font-size: 18px;
	font-weight: 400;
	color: #555;
}

#content table.new-table td {
	font-size: 16px;
	font-weight: 400;
	color: #272727;
	padding: 2px 4px;
}

.new-table-container {
	display: block;
	margin-bottom: 64px;
	margin-top: 32px;
}

#project-applied-effort {
	margin-top: 48px;
}

.new-table-container .has-line {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	width: 80%;
}

.new-table-container .line-separator {
	flex-grow: 1;
	height: 2px;
	background-color: #ccc;
}

.new-table-container .progress {
	margin-right: 20px;
	height: 13px;
	position: relative;
	overflow: visible !important;
}

.new-table-container .progress-bar {
	position: relative;
	overflow: visible !important;
}


.new-table-container .progress-bar:first-child {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}

	.new-table-container .progress-bar:last-child {
		border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;
	}

.new-table-container .progress-bar {
	position: relative;
	overflow: visible !important;
}

.new-table-container .progress-bar .pop {
	display: none;
	position: absolute;
	top: -28px;
	left: 50%;
	transform: translateX(-50%);
	font-weight: bold;
	background-color: #575757;
	text-align: center;
	width: 60px;
	min-width: 53px;
	height: 22px;
	border-radius: 4px;
	align-content: center;
	font-size: 10px;
	font-weight: 400;
	z-index: 2;
}

	.new-table-container .progress-bar:hover .pop {
		display: block;
	}

	.new-table-container .progress .total-effort {
		background: #575757;
	}

.new-table-container .progress .total-invoice {
	background: #4f7ed1;
}

.new-table-container .progress .total-invoiced {
	background: #4db34d;
}

.new-table-container .progress .total-internal-bonus {
	background: #cc5792;
}

.new-table-container .progress .total-public-bonus {
	background: #ffcf6a;
}

.triangle {
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-top: 10px solid #575757;
	position: absolute;
	top: 17px;
	left: 50%;
	transform: translateX(-50%);
}

.btn-dark {
	padding: 8px 24px;
	background-color: #454545;
	color: #fff;
	font-weight: 400;
	font-size: 18px;
	border-radius: 7px;
	height: 48px;
}

.btn-dar:hover {
	background-color: #494949;
}

.select-540 {
	width: 540px;
	display: block;
	margin-top: 6px;
}

.resultado-diario .avatars-header {
	margin-bottom: 16px;
}

.resultado-diario .avatars-wrapper .avatar-pill {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: 4px 12px 4px 4px;
	font-size: .9rem;
	border-radius: 999px;
	border: 1px solid #DADCE099;
	;
	transition: all .2s;
}

	.resultado-diario .avatars-wrapper .avatar-pill.active {
		background-color: #0095B8;
		color: #fff;
		border-color: #19B4D7;
	}

		.resultado-diario .avatars-wrapper .avatar-pill.active:hover {
			background-color: #069fc2;
			color: #fff;
		}

	.resultado-diario .avatars-wrapper .avatar-pill:hover {
		background-color: #f1f1f1;
		color: rgb(0, 0, 0);
		cursor: pointer;
		border: 1px solid #e6e6e6;
	}

.resultado-diario .projects {
	display: flex;
	justify-content: space-between;
	margin-bottom: 1rem;
	background-color: #f1f1f1;
	padding: 8px 12px;
	border-radius: 8px;
	align-items: center;
	gap: 24px;
}

.resultado-diario .project-tabs {
	display: flex;
	gap: 16px;
	flex: 1;
}

.resultado-diario .nav {
	flex-wrap: nowrap !important;
}

.resultado-diario .project-tabs .nav-link {
	border-radius: .75rem;
	width: 100%;
	font-weight: 500;
	text-align: center;
	height: 100%;
	align-content: center;
}

.resultado-diario .project-tabs .nav-item {
	width: -webkit-fill-available;
}

.resultado-diario .project-tabs .nav-link.active {
	background-color: #069fc2 !important;
	color: #fff;
}
.resultado-diario .project-tabs .nav-item.inactive {
	display: none !important; 
}


.resultado-diario .project-tabs .nav-link:not(.active) {
	background: #fff;
	border: 1px solid #DADCE099;
	color: #212529;
}

	.resultado-diario .project-tabs .nav-link:not(.active):hover {
		background: #f1f1f1;
		border: 1px solid #DADCE099;
		color: #212529;
	}

.resultado-diario .calendar-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1rem;
	background-color: #f1f1f1;
	padding: 8px 12px;
	border-radius: 8px;
}

.resultado-diario .legend .badge {
	background-color: white;
	border-radius: .5rem;
	font-size: .85rem;
	font-weight: 300;
	height: 100%;
	padding: .5rem .75rem;
	color: rgb(59, 59, 59);
	display: flex;
	gap: 8px;
	align-items: center;
	border: 1px solid #dbdbdb;
}

	.resultado-diario .legend .badge strong {
		font-weight: 600;
	}

.badge-square-abandoned,
.badge-square-defeat,
.badge-square-drawn,
.badge-square-no-result,
.badge-square-victory {
	min-height: 16px;
	min-width: 16px;
	border-radius: 4px;
	border: 1px solid #d1d1d1;
}

.badge-square-victory {
	background-color: #37A305;
}

.badge-square-defeat {
	background-color: #C91E54;
}

.badge-square-abandoned {
	background-color: #747474;
}

.badge-square-drawn {
	background-color: #F4AB61;
}

.badge-square-no-result {
	background-color: #6B89A6;
}

.resultado-diario .calendar-month-filter {
	border: none;
	display: flex;
	gap: 16px;
	align-items: center;
}

	.resultado-diario .calendar-month-filter div {
		background-color: #0095B8;
		padding: 8px;
		border-radius: 4px;
		display: flex;
	}

.resultado-diario .overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.2);
	z-index: 1040;
}

.resultado-diario .popover-filtro {
	position: absolute;
	background: #f1f1f1;
	border-radius: 16px;
	padding: 1rem;
	z-index: 1050;
	transition: all 0.2s ease;
}

.resultado-diario .btn-month {
	padding: 8px 16px;
	border-radius: 8px;
	background-color: white;
	border: 1px solid #d1d1d1;
	transition: all 0.4s;
	color: #363636;
	text-align: center;
}

	.resultado-diario .btn-month:hover {
		background-color: rgb(231, 231, 231);
		transition: all 0.4s;
	}

.resultado-diario .btn-month.active {
	padding: 8px 16px;
	border-radius: 8px;
	background-color: #0095B8;
	border: 1px solid #d1d1d1;
	transition: all 0.4s;
	color: #ffffff;
}

.resultado-diario .grid-month {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.5rem;
}

.resultado-diario .calendar-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
}

	.resultado-diario .calendar-grid .day {
		background: #f1f1f1;
		min-height: 72px;
		border-radius: .5rem;
		position: relative;
		padding: .5rem;
		font-size: .85rem;
		cursor: pointer;
	}

.resultado-diario .calendar-grid [class="day"] {
	cursor: auto;
}


.resultado-diario .calendar-grid .day .day-number {
	position: absolute;
	top: .4rem;
	left: .6rem;
	font-weight: 600;
}

.day.status-victory {
	background-color: #37A305 !important;
	color: #fff;
}

.day.status-defeat {
	background-color: #C91E54 !important;
	color: #fff;
}

.day.status-drawn {
	background-color: #f0a357 !important;
	color: #ffffff;
}

.day.status-noresult {
	background-color: #6B89A6 !important;
	color: #fff;
}

.day.status-abandoned {
	background-color: #747474 !important;
	color: #fff;
}

.day.today .day-number {
	background-color: #0095B8 !important;
	color: #fff;
	border-radius: 4px;
	padding: 4px 6px;
}

.resultado-diario .day.today {
	border: 2px solid #0095B8;
	color: #fff;
	background-color: white;
	border-radius: .5rem;
	padding: 0px;
}

.resultado-diario .weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	text-align: center;
	font-weight: 600;
	margin-bottom: .5rem;
	color: #6c757d;
}

.resultado-diario .custom-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 1050;
}

	.resultado-diario .custom-modal.show {
		display: flex;
	}

.resultado-diario .modal-content-custom {
	background: white;
	border-radius: 12px;
	max-width: 580px;
	padding: 0;
	position: relative;
	animation: modalSlideIn 0.3s ease-out;
}

@keyframes modalSlideIn {
	from {
		opacity: 0;
		transform: translateY(-20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.resultado-diario .modal-header-custom {
	padding: 20px 20px 16px;
	border-bottom: 1px solid #e9ecef;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.resultado-diario .modal-title-custom {
	font-size: 1.25rem;
	font-weight: 600;
	color: #212529;
	margin: 0;
}

.resultado-diario .modal-message b {
	color: #5e5e5e;
	font-weight: 700;
	font-size: 16px;
	margin-top: 10px;
}

.resultado-diario .modal-subtitle {
	color: #6c757d;
	font-size: 0.9rem;
	margin-top: 4px;
}

.resultado-diario .modal-close {
	background: none;
	border: none;
	font-size: 1.5rem;
	color: #6c757d;
	cursor: pointer;
	padding: 0;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
}

	.resultado-diario .modal-close:hover {
		color: #212529;
	}

.resultado-diario .modal-body-custom {
	padding: 20px;
}

.resultado-diario .status-selector {
	display: flex;
	width: 100%;
	justify-content: space-between;
	gap: 8px;
	flex-wrap: nowrap;
	margin-bottom: 20px;
}

.resultado-diario .status-btn {
	padding: 4px 8px;
	border: 2px solid #e9ecef;
	background: white;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.2s;
	font-size: 0.9rem;
	display: flex;
	align-items: center;
	gap: 8px;
}

	.resultado-diario .status-btn:hover {
		border-color: #0095B8;
	}

	.resultado-diario .status-btn.active {
		border-color: #0095B8;
		background: #0095B8;
		color: white;
	}

.resultado-diario .status-indicator {
	width: 16px;
	height: 16px;
	border-radius: 4px;
	border: 1px solid rgba(255,255,255,0.3);
}

.status-indicator.victory {
	background-color: #37A305;
}

.status-indicator.defeat {
	background-color: #C91E54;
}

.status-indicator.drawn {
	background-color: #F4AB61;
}

.status-indicator.noresult {
	background-color: #6B89A6;
}

.status-indicator.abandoned {
	background-color: #747474;
}

.resultado-diario .status-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 4px 8px;
	border-radius: 8px;
	font-size: 0.9rem;
	font-weight: 500;
	color: rgb(66, 66, 66);
	border: 1px solid #dbdbdb;
}

.resultado-diario .status-badge.noresult {
	width: 155px;
}
	.resultado-diario .date-info {
	display: flex;
	align-items: center;
	gap: 12px;
	color: #6c757d;
	font-size: 0.9rem;
	width: 100%;
	justify-content: end;
	margin-left: 12px;
}

.resultado-diario .justification-section {
	margin-top: 20px;
}

.resultado-diario .justification-label {
	font-size: 0.9rem;
	color: #6c757d;
	margin-bottom: 8px;
}

.resultado-diario .justification-text {
	background: #f8f9fa;
	border: 1px solid #e9ecef;
	border-radius: 8px;
	padding: 12px;
	font-size: 0.9rem;
	line-height: 1.4;
	color: #495057;
	min-height: 60px;
}

	.resultado-diario .justification-text #detailJustification {
		color: #424242 !important;
	}

.resultado-diario .justification-input {
	width: 100%;
	border: 1px solid #e9ecef;
	border-radius: 8px;
	padding: 12px;
	font-size: 0.9rem;
	resize: vertical;
	min-height: 80px;
	font-family: 'Segoe UI', sans-serif;
}

	.resultado-diario .justification-input:focus {
		outline: none;
		border-color: #0095B8;
		box-shadow: 0 0 0 0.2rem rgba(0, 149, 184, 0.25);
	}

.resultado-diario .modal-footer-custom {
	padding: 16px 20px 20px;
	display: flex;
	gap: 12px;
	justify-content: flex-end;
}

.resultado-diario .btn-custom {
	padding: 10px 20px;
	border-radius: 8px;
	font-size: 0.9rem;
	font-weight: 500;
	border: none;
	cursor: pointer;
	transition: all 0.2s;
}

.resultado-diario .btn-cancel {
	background: #6c757d;
	color: white;
}

	.resultado-diario .btn-cancel:hover {
		background: #5a6268;
	}

.resultado-diario .btn-save {
	background: #0095B8;
	color: white;
}

	.resultado-diario .btn-save:hover {
		background: #069fc2;
	}

.resultado-diario .btn-back {
	background: #6c757d;
	color: white;
}

	.resultado-diario .btn-back:hover {
		background: #5a6268;
	}

.resultado-diario .date-field {
	background: #f0f0f0;
	border: 1px solid #e9ecef;
	border-radius: 6px;
	padding: 6px 10px;
	font-size: 0.85rem;
	color: #495057;
	width: fit-content;
}

.resultado-diario .time-field {
	background: #f0f0f0;
	border: 1px solid #e9ecef;
	border-radius: 6px;
	padding: 4px 10px;
	font-size: 0.85rem;
	color: #495057;
}

.d-flex {
	display: flex;
}

.form-btn.ativo {
	fill: white !important;
}

.modal-body-custom.border-bottom {
	padding-bottom: 0;
}

.modal-body-custom.border-bottom > div {
	padding-bottom: 14px;
}

#justification-count {
	float: right;
	margin-top: 4px;
	color: #6c757d;
}

.justify-items-center {
	justify-items: center !important;
}

.success-icon {
	margin-bottom: 15px;
}

.resultado-diario #daily-captain {
	font-size: 12px;
	display: flex;
	align-self: center;
	width: 100%;
	color: #6c757d;
}

.cursor-block {
	cursor: no-drop !important;
}