clickAble.chip-tmpl {
	display: inline-block;
	margin: 0 5px 5px 0;
}

.default-chip {
	/* border: 2px solid #e0e0e0; */
	/* border-radius: 5px; */
	/* background: #e0e0e0; */
	/* padding: 5px; */
	/* position: absolute; */
	/* margin-left: 30%; */
	color: #0072b0;
	max-width: 33%;
}

.chip-tmpl:focus {
	outline: none;
}
chip-tmpl:focus .default-chip {
	border: 2px solid #9e9e9e;
	background: #0072b0;
	color: white;
}

.chip-failed .default-chip {
	color: red;
}

.chips {
	display: block;
	padding: 5px;
}
chips > div {
	display: inline;
}
chips > div > input {
	height: 100%;
	border: none;
	font-size: 14px;
}
chips > div > input:focus {
	outline: none;
}

.chip-out-focus {
	border-bottom: 1px solid #e0e0e0;
}

.chip-in-focus {
	border-bottom: 1px solid #106cc8;
}
html {
	min-height: 100vh;
	height: fit-content;
}
body {
	height: 100vh !important;
	display: flex;
	flex-direction: column;
	color: var(--text-color);
}
ui-view,
pageheader,
.main_container,
.main_body_container {
	min-height: 0;
	height: 100%;
	display: flex;
	flex-direction: column;
	overflow: auto;
}
topbar {
	height: fit-content;
	position: sticky;
	top: 0px;
	z-index: 10;
	display: block;
}

/* Custom CSS */
:root {
	--font-size: 16px;
	/*--main-color-base: #222;
	--text-color: #222;*/
	--main-color-base: hsl(210, 30%, 14%);
	--text-color: hsl(210, 30%, 14%);
	/*--accent-color: #de3163;
	--accent-color-hover: hsl(343, 62%, 33%);*/
	--accent-color: hsl(220, 100%, 50%);
	--accent-color-hover: hsl(220, 100%, 40%);
	/*--accent-color: DeepPink;*/
	--links-color: hsl(220, 100%, 50%);
	--links-color-hover: hsl(220, 100%, 40%);
	--light-gray-5: #808080;
	--light-gray-4: #aaa;
	--light-gray-3: #ddd;
	--light-gray-2: #eee;
	--light-gray-1: #fff;
	--white-color: #fff;

	--scrollbar-size: 8px;

	--main-color-97: hsl(210, 40%, 97%);
	--main-color-96: hsl(210, 40%, 96%);
	--main-color-90: hsl(210, 40%, 90%);
	--main-color-80: hsl(210, 40%, 80%);
	--main-color-70: hsl(210, 40%, 70%);
	--main-color-60: hsl(210, 40%, 60%);
	--main-color-50: hsl(210, 40%, 50%);
	--main-color-40: hsl(210, 40%, 40%);
	--main-color-30: hsl(210, 40%, 30%);
	--main-color-20: hsl(210, 40%, 20%);
	--main-color-10: hsl(210, 40%, 10%);

	--card-div-focus-color: hsl(213, 70%, 88%);

	/*--COLOR_CONFIRM: hsl(128, 82%, 34%);
	--COLOR_CONFIRM_HOVER: hsl(128, 82%, 24%);*/
	/*--COLOR_WARN: #e5bf00;
	--COLOR_WARN_HOVER: hsl(48, 100%, 40%);*/
	/*--COLOR_DANGER: #e57a00;
	--COLOR_DANGER_HOVER: hsl(32, 100%, 35%);*/
	--COLOR_PRIM: #226bfe;
	--COLOR_CONFIRM: hsl(130, 60%, 40%);
	--COLOR_CONFIRM_HOVER: hsl(130, 60%, 30%);
	--COLOR_WARN: hsl(37, 95%, 56%);
	--COLOR_WARN_HOVER: hsl(37, 95%, 46%);
	--COLOR_DANGER: hsl(30, 100%, 49%);
	--COLOR_DANGER_HOVER: hsl(30, 100%, 39%);
	--COLOR_DENY: hsl(0, 65%, 57%);
	--COLOR_DENY_HOVER: hsl(0, 65%, 47%);
	--COLOR_AGEND: hsl(273, 41%, 46%);
	--COLOR_AGEND_HOVER: hsl(273, 41%, 36%);
	--COLOR_AGUARDA: hsl(286, 88%, 74%);
	--COLOR_AGUARDA_HOVER: hsl(286, 88%, 64%);
	--COLOR_SENT: #54b5c2;
	--COLOR_DEMO: hsl(335, 70%, 53%);
	--COLOR_DEMO_HOVER: hsl(335, 70%, 43%);
	--COLOR_NA: #af9b4c;
	--COLOR_DIM: #818181;
}

* {
	transition-property: opacity, color, background, border, border-color, transform;
	transition-duration: 150ms;
	transition-timing-function: ease-out;
	box-sizing: border-box;
}

.ng-hide,
.ng-leave {
	display: none !important;
}

.COLOR_LG-1 {
	color: var(--light-gray-1);
}
.COLOR_LG-2 {
	color: var(--light-gray-2);
}
.COLOR_LG-3 {
	color: var(--light-gray-3);
}
.COLOR_LG-4 {
	color: var(--light-gray-4);
}
.COLOR_LG-5 {
	color: var(--light-gray-5);
}

.COLOR_CONFIRM {
	color: var(--COLOR_CONFIRM);
}
.COLOR_WARN {
	color: var(--COLOR_WARN);
}
.COLOR_DANGER {
	color: var(--COLOR_DANGER);
}
.COLOR_PRIM {
	color: var(--COLOR_PRIM);
}
.COLOR_DENY {
	color: var(--COLOR_DENY);
}
.COLOR_AGEND {
	color: var(--COLOR_AGEND);
}
.COLOR_AGUARDA {
	color: var(--COLOR_AGUARDA);
}
.COLOR_SENT {
	color: var(--COLOR_SENT);
}
.COLOR_DEMO {
	color: var(--COLOR_DEMO);
}
.COLOR_NA {
	color: var(--COLOR_NA);
}
.COLOR_DIM {
	color: var(--COLOR_DIM);
}
.COLOR_WHITE {
	color: var(--white-color);
}

.transparentInput {
	background: transparent;
	border: 0px;
	outline: 0px;
}

/* Scrollbar CSS */
*::-webkit-scrollbar {
	width: var(--scrollbar-size);
	height: var(--scrollbar-size);
}
*::-webkit-scrollbar-track {
	background: transparent;
}
*::-webkit-scrollbar-thumb {
	background: var(--light-gray-4);
	border-radius: 4px;
}
*::-webkit-scrollbar-thumb:hover {
	background: var(--accent-color);
}

body {
	background: #fff;
	position: relative;
	z-index: 0;
	font-family: "DM Sans", "Lato", sans-serif !important;
	background: #fbfbfb;
	font-weight: 500;
}

.md-datepicker-input-container {
	border: 0px;
	border-bottom: 2px solid var(--main-color-90);
}
#textToCopy {
	position: fixed;
	z-index: -99;
	opacity: 0;
	pointer-events: none;
}
.main_body_container {
	overflow: auto;
}
#smartEMPlogo-sm {
	height: 2rem;
}
.clickAble,
button,
a {
	cursor: pointer;
}
button:disabled,
a:disabled {
	cursor: not-allowed !important;
	/*color: var(--main-color-30) !important;
	 background: var(--main-color-70) !important; */
	opacity: 0.2 !important;
}
.md-button.md-default-theme:not([disabled]).md-icon-button:hover,
.md-button:not([disabled]).md-icon-button:hover {
	color: var(--accent-color);
	background-color: rgba(158, 158, 158, 0.2);
}

.md-icon-button,
.md-icon-button * {
	display: grid;
	place-items: center;
}

.md-chips .md-chip-input-container {
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.main_container {
	margin: auto;
}
a:has(svg) {
	text-decoration: none;
}
a {
	color: var(--links-color);
}
a:hover {
	color: var(--accent-color);
}
.svgLink {
	color: var(--main-color-base);
}
.svgLink:hover {
	color: var(--accent-color);
}
.svgLink-dim {
	color: var(--light-gray-4);
}
.svgLink-dim:hover {
	color: var(--light-gray-5);
}
a.fullHistory {
	width: fit-content;
	margin-top: 0.5rem;
	margin-left: calc(1rem - 2px);
	position: relative;
	z-index: 2;
}
a.fullHistory:hover {
	color: var(--white-color);
}
a.fullHistory::before {
	content: "";
	border-radius: 999rem;
	position: absolute;
	inset: -0.25rem -1rem;
	background: var(--accent-color);
	opacity: 0;
	transition: 0.3s ease-out;
	z-index: -1;
}
a.fullHistory:hover::before {
	opacity: 1;
}

/*.md-dialog-container { backdrop-filter: blur(2px) }*/
md-dialog:has(.dialogHead[dialog-draggable]) {
	border-radius: 1rem;
	position: absolute !important;
}
md-dialog,
md-dialog * {
	transition-property: opacity, color, background, border, border-color, transform !important;
}
.dialogSm {
	width: 30rem;
}
.dialogMed {
	width: 42rem;
}
.dialogLarge {
	width: 50%;
	min-width: 42rem;
}
.dialogFullH {
	height: 90%;
	max-height: 90%;
}
.dialogHead {
	width: 100%;
	padding: 0.5rem 1rem;
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	position: sticky;
	top: 0px;
	z-index: 99;
	background: var(--main-color-base);
	color: var(--white-color);
	cursor: move;
	-webkit-user-select: none;
	user-select: none;
}
.dialogBody {
	width: 100%;
	padding: 2rem;
}

.floatingLabel {
	height: fit-content;
	padding: 0.5rem;
	border-radius: 6px;
	position: sticky;
	top: 0px;
	z-index: 10;
	text-align: center;
	background: var(--main-color-base);
	color: var(--white-color);
}

.dayHeader {
	padding: 0.5rem;
	border-radius: 6px 6px 0px 0px;
	background-color: var(--main-color-base);
	color: var(--white-color);
	text-align: center;
}

.hourBlock {
	line-height: 1;
	padding: 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	user-select: none;
}

.addHour {
	width: 100%;
	padding: 0.5rem;
	line-height: 1;
	border-top: 2px solid var(--main-color-50);
	border-radius: 0px 0px 6px 6px;
	background: var(--main-color-96);
	display: flex;
	align-items: center;
	gap: 1;
}

.hourFree {
	background: var(--main-color-90);
	color: var(--main-color-10);
	cursor: pointer;
}
.hourBusy {
	background: var(--main-color-96);
	color: var(--main-color-70);
	pointer-events: none;
	cursor: not-allowed !important;
}
.hourFree .icon {
	color: var(--COLOR_CONFIRM);
}
.hourBusy .icon {
	color: var(--COLOR_DENY);
}
.hourFree.selected {
	background: var(--main-color-20);
	color: var(--white-color);
}
.hourFree.selected .icon {
	color: var(--white-color);
}

.rounded-icon {
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-size: 0.75rem;
}
.main-color-icon {
	background: var(--accent-color);
}
.dim-color-icon {
	background: var(--main-color-70);
}

.floating-icon {
	box-sizing: content-box;
	border: 4px solid var(--white-color);
	color: var(--white-color);
	top: calc(1rem);
	left: calc(-1rem - 2px);
	position: absolute;
	z-index: 1;
}
.subHead {
	color: var(--light-gray-5);
	font-size: 0.75rem;
}

.card-div {
	min-height: fit-content;
	/*height: 6rem;*/
	padding: 1rem 1.5rem;
	margin-left: calc(1rem - 2px);
	position: relative;
	background-color: var(--main-color-96);
	border-radius: 8px;
	/*display: flex;
	flex-direction: column;
	gap: 1rem;*/
}

.neoScroller {
	scrollbar-gutter: stable;
}

.neoScroller::-webkit-scrollbar {
	width: var(--scrollbar-size);
	margin-right: 1rem;
}

.scrollable {
	min-height: 0;
	height: 100%;
	overflow-y: auto !important;
}
.itemLabel,
label {
	font-size: 0.75rem;
	color: var(--main-color-50);
	background: transparent;
}
.column {
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.contact-body .btn-action:not(.btn-fav) {
	opacity: 0;
}
.contact-body:hover .btn-action {
	opacity: 1;
}

.card-div-focus {
	background-color: var(--card-div-focus-color);
}

.card-title,
.card-title-low {
	width: 100%;
	line-height: calc(1.75rem + 8px);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.card-title {
	font-size: 1.25rem;
}
.card-title-low {
	color: var(--main-color-50);
}

.card-header {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
}

.card-timestamp {
	width: fit-content;
	white-space: nowrap;
	color: var(--main-color-50);
}

.card-obs {
	color: var(--main-color-50);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	line-clamp: 2;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-top: 0.25rem;
	white-space: preserve;
}

.card-operator {
	margin-top: 1rem;
	line-height: 1;
}

.card-operator > i,
.card-operator > svg {
	color: var(--main-color-50);
	fill: var(--main-color-50);
}

.card-footer {
	margin-top: 1rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2rem;
}

.card-result {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	line-height: 1;
	color: var(--accent-color);
	font-size: 0.75rem;
}

.semResultados {
	margin-left: 1rem;
	color: var(--light-gray-5);
}

.obs-line {
	line-height: 1;
	color: var(--main-color-50);
}

.neoInput {
	width: 100%;
	display: flex;
	flex-direction: column;
}
/*.neoInput select, .neoInput input:not([type="checkbox"]) { width: clamp(8rem, 100%, 24rem) }*/
.neoInput * {
	margin: 0px;
	outline: none;
}
.neoInput > input,
.neoInput > select {
	border: 0px;
	background: transparent;
}
.neoInput > input:not(:read-only),
.neoInput > select {
	border-bottom: 2px solid var(--main-color-90);
}
.neoInput > :focus {
	border-color: var(--accent-color) !important;
}
.neoInput > label {
	transform: translateY(calc(113.3333%)) scale(1.3333);
	transform-origin: left;
	/*font-size: 1rem;*/
	pointer-events: none;
	font-weight: 500;
}
.neoInput:has(input:focus) > label,
.neoInput:has(select) > label,
.neoInput:has(input:not(:placeholder-shown)) > label {
	transform: translateY(0%);
	font-size: 0.75rem;
	font-weight: bold;
}
.neoInput > select optgroup {
	font-weight: 900;
	text-indent: 1rem;
}
.neoInput > select option {
	text-indent: 1rem;
}
.neoInput:has(input[type="checkbox"]) > label {
	font-size: 1rem;
	line-height: normal;
	color: var(--text-color);
	font-weight: 500;
}
.neoInput > select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background: transparent
		url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path d="M140.3 376.8c12.6 10.2 31.1 9.5 42.8-2.2l128-128c9.2-9.2 11.9-22.9 6.9-34.9S301.4 192 288.5 192l-256 0c-12.9 0-24.6 7.8-29.6 19.8S.7 237.5 9.9 246.6l128 128 2.4 2.2z"/></svg>')
		no-repeat right 0.25rem center;
	background-size: 0.625rem;
	padding-right: 1rem;
}
.neoInput:has(input[type="checkbox"]) {
	flex-direction: row;
	gap: 0.25rem;
	align-items: center;
}
.neoInput:has(input[type="checkbox"]) > label {
	pointer-events: all;
	background: transparent !important;
}
.neoInput > input[type="checkbox"] {
	margin: 0px;
}
.neoInput > textarea {
	padding: 0.5rem 1rem;
	border: 2px solid var(--main-color-90);
	border-radius: 4px;
}

.neoInput.required > label::after {
	content: "\2731";
	margin-left: 0.2em;
	display: inline-block;
	transform: translateY(-0.2em);
	color: red;
	font-weight: 500 !important;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button,
input[type="number"] {
	appearance: textfield;
	-webkit-appearance: none;
	-moz-appearance: textfield;
	margin: 0;
}

.flyout {
	position: absolute;
	bottom: 1rem;
	left: 50%;
	transform: translateX(-50%);
	pointer-events: none;
}
.flyoutText {
	margin: 0px;
	padding: 0.5rem 2rem;
	border-radius: 4px;
	font-size: 0.875rem;
	background: var(--main-color-base);
	color: #fff;
	box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.25);
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}
.flyoutAnimation {
	animation: floyoutAnim ease-out 1800ms forwards;
}

label {
	margin-bottom: 0 !important;
}
md-input-container.md-default-theme:not(.md-input-focused):not(.md-input-invalid) label.md-required:after,
md-input-container:not(.md-input-focused):not(.md-input-invalid) label.md-required:after {
	color: rgb(221, 44, 0);
}
md-input-container.md-input-focused label:not(.md-no-float),
md-input-container.md-input-has-placeholder label:not(.md-no-float),
md-input-container.md-input-has-value label:not(.md-no-float) {
	transform: translate3d(0, 6px, 0) scale(0.9);
	color: #818181;
	opacity: 0.75;
}
@keyframes floyoutAnim {
	from {
		opacity: 0;
		transform: translateY(0px);
	}
	8% {
		opacity: 1;
		transform: translateY(-1.5rem);
	}
	92% {
		opacity: 1;
		transform: translateY(-1.5rem);
	}
	to {
		opacity: 0;
		transform: translateY(0px);
	}
}

/* Butoes */
/*
button,
.button {
	min-width: 0rem !important;
	min-height: 0rem !important;
	margin: 0px;
	padding: 0px;
	border: 0px;
	display: grid;
	place-items: center;
	white-space: nowrap;
	font-weight: 500;
}
*/

/* html body button,
html body .button, */
html body .search-bt,
button,
.button {
	border: 1px solid var(--light-gray-2);
	background: var(--white-color);
	border-radius: 6px;
	padding: 6px 10px;
	cursor: pointer;
	color: var(--text-color);
	font-weight: 600;
	font-size: 0.875rem;
	display: flex;
	align-items: center;
	gap: 6px;
}

/* html body button:hover,
html body .button:hover, */
html body .search-bt:not(:disabled),
button:hover:not(:disabled),
.button:hover:not(:disabled) {
	background: var(--main-color-base);
	color: var(--white-color);
}

html body a {
	color: var(--links-color);
}

button.btn-style {
	padding: 0.5rem 2rem;
	margin: 0px;
	cursor: pointer;
	border-radius: 4px;
	font-size: 0.75rem;
	text-transform: uppercase;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
button.btn-style:hover,
button.btn-style.active {
	border-color: var(--accent-color);
	background: var(--accent-color);
	color: var(--white-color);
}
button.solid {
	background: var(--main-color-base);
	color: #fff;
}
button.solid:hover {
	background: var(--accent-color);
}
button.solid-light {
	background: var(--light-gray-2);
	color: var(--main-color-base);
}
button.empty {
	border: 2px solid var(--main-color-base);
	background: transparent;
	color: var(--main-color-base);
}

.rectangle-xs {
	padding: 0.5rem 1rem;
	margin: 0px !important;
}

.roundBt,
.ball-icon {
	min-width: fit-content;
	min-height: fit-content;
	aspect-ratio: 1/1 !important;
	flex-shrink: 0;
	border-radius: 50%;
	display: grid;
	place-items: center;
}
.inline-bt {
	width: fit-content;
	padding-inline: 1rem;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
}

.svgButton,
.btn-action {
	border: 0;
	padding: 0;
	display: grid;
	place-items: center;
	border-radius: 50%;
	color: var(--main-color-base);
}
.svgButton:hover {
	background: rgba(255, 255, 255, 0.1);
	color: var(--accent-color);
}

.svg-dark {
	border: 0;
	background: var(--main-color-base);
	color: var(--white-color);
}

.svg-dark:hover {
	border: 0;
	background: var(--main-color-30);
	color: var(--white-color);
}

.svg-light {
	border: 0;
	background: transparent;
	color: var(--white-color);
}

.svg-deny {
	border: 0;
	background: hsla(0, 65%, 57%, 0.1);
	color: hsl(0, 65%, 57%);
}

.svg-deny:hover {
	background: hsla(0, 65%, 57%, 0.2);
	color: hsl(0, 65%, 47%);
}

.svg-light:hover {
	border: 0 !important;
	background: rgba(255, 255, 255, 0.2) !important;
}

.btn-size-050 {
	height: 0.5rem;
}
.btn-size-075 {
	height: 0.75rem;
}
.btn-size-100 {
	height: 1rem;
}
.btn-size-150 {
	height: 1.5rem;
}
.btn-size-175 {
	height: 1.75rem;
}
.btn-size-200 {
	height: 2rem;
}
.btn-size-250 {
	height: 2.5rem;
}
.btn-size-300 {
	height: 3rem;
}
.btn-size-325 {
	height: 3.25rem;
}
.btn-size-350 {
	height: 3.5rem;
}
.btn-size-400 {
	height: 4rem;
}

.btn-dim {
	color: var(--main-color-30);
	background: var(--main-color-70);
}
.btn-dim:hover {
	color: var(--white-color);
	background: var(--main-color-60);
}
.btn-main {
	color: var(--white-color);
	background: var(--main-color-base);
}
.btn-main:hover {
	background: var(--light-gray-5);
}
.btn-accent {
	color: var(--white-color);
	background: var(--accent-color);
}
.btn-accent:hover {
	background: var(--accent-color-hover);
}
.btn-confirm {
	color: var(--white-color);
	background: var(--COLOR_CONFIRM);
}
.btn-confirm:hover {
	background: var(--COLOR_CONFIRM_HOVER);
}
.btn-warn {
	color: var(--white-color);
	background: var(--COLOR_WARN);
}
.btn-warn:hover {
	background: var(--COLOR_WARN_HOVER);
}
.btn-danger,
.btn-danger:focus {
	color: var(--white-color);
	background: var(--COLOR_DANGER);
}
.btn-danger:hover {
	background: var(--COLOR_DANGER_HOVER);
}
.btn-deny {
	color: var(--white-color);
	background: var(--COLOR_DENY);
}
.btn-deny:hover {
	background: var(--COLOR_DENY_HOVER);
}
.btn-wait {
	color: var(--white-color);
	background: var(--COLOR_AGUARDA);
}
.btn-wait:hover {
	background: var(--COLOR_AGUARDA_HOVER);
}
.btn-notes {
	color: var(--white-color);
	background: var(--links-color);
}
.btn-notes:hover {
	background: var(--links-color-hover);
}
.btn-meet {
	color: var(--white-color);
	background: var(--COLOR_DEMO);
}
.btn-meet:hover {
	background: var(--COLOR_DEMO_HOVER);
}
.btn-attach {
	background: var(--COLOR_DANGER);
}
.btn-attach:hover {
	background: var(--COLOR_DANGER_HOVER);
}
.btn-action {
	border: 0;
	color: var(--main-color-50);
}
.btn-action:hover {
	background: hsla(210, 50%, 50%, 0.3);
	color: var(--main-color-30);
}
.btn-fav {
	color: var(--COLOR_DANGER);
}

.btn-disabled,
.btn-unselected {
	background: var(--main-color-70) !important;
}
.btn-unselected:hover,
.btn-disabled:hover {
	background: var(--main-color-60) !important;
}
.btn-disabled {
	cursor: not-allowed;
	pointer-events: hover !important;
}
.btn-disabled:hover {
	background: var(--main-color-70) !important;
}
.btn[disabled="disabled"] {
	background: var(--main-color-80) !important;
}

.badge-gray {
	background: var(--light-gray-4);
}
.badge-dim {
	background: var(--main-color-80);
}
.badge-main {
	background: var(--main-color-base);
}
.badge-accent {
	background: var(--accent-color);
}
.badge-confirm {
	background: var(--COLOR_CONFIRM);
}
.badge-warn {
	background: var(--COLOR_WARN);
}
.badge-deny {
	background: var(--COLOR_DENY);
}
.badge-wait {
	background: var(--COLOR_AGUARDA);
}
.badge-notes {
	background: var(--links-color);
}
.badge-meet {
	background: var(--COLOR_DEMO);
}
.badge-attach {
	background: var(--COLOR_DANGER);
}
.badge-fav {
	color: var(--COLOR_DANGER);
}

.green {
	background-color: #4caf50;
}
.orange {
	background-color: #ff9800;
}
.red {
	background-color: #f44336;
}
.dark-red {
	background-color: #b71c1c;
}
.blue {
	background-color: #2196f3;
}
.amber {
	background-color: #ffc107;
	color: #4d2900 !important;
}
.purple {
	background-color: #9c27b0;
}
.teal {
	background-color: #009688;
}
.indigo {
	background-color: #3f51b5;
}
.yellow {
	background-color: #ffeb3b;
	color: #4d2900 !important;
}
.gray {
	background-color: #607d8b;
}

.neoBadge {
	border-radius: 4px;
	padding: 0.75rem 1rem;
	display: flex;
	align-items: center;
	gap: 0.75rem;
	line-height: 1.1;
}

.badgeTitle {
	font-size: 0.75rem;
	color: var(--main-color-50);
}

.badgeIcon {
	width: 1.5rem !important;
	aspect-ratio: 1/1;
	display: grid;
	place-items: center;
	font-size: 1.5rem;
}

.badgeBody {
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.countBadge {
	width: 1.25rem;
	height: 1.25rem;
	aspect-ratio: 1/1;
	border-radius: 50%;
	line-height: 1;
	font-size: 0.625rem;
	display: grid;
	place-items: center;
	background: var(--main-color-20);
	color: var(--white-color);
	position: absolute;
	right: -0.4rem;
	top: -0.4rem;
}

button:has(.countBadge) {
	position: relative;
}
.copyDiv {
	border-radius: 0.375rem;
	transition-property: all;
}
.copyDiv:hover {
	padding-left: 0.75rem;
	padding-right: 0.75rem;
	background: var(--main-color-90);
}
.copyDiv .copyIcon {
	opacity: 0;
	pointer-events: none;
	color: var(--main-color-50);
}
.copyDiv:hover .copyIcon {
	opacity: 1;
}

.copyTooltip {
	position: relative;
	z-index: 0;
}
.copyTooltip::before {
	content: "";
	position: absolute;
	border-radius: 0.375rem;
	inset: 0.25rem;
	background: var(--main-color-90);
	opacity: 0;
	z-index: -1;
	transition: all 0.1s ease-out !important;
}
.copyTooltip:hover::before {
	inset: -4px -12px;
}
.copyTooltip.square:hover::before {
	inset: -8px;
}
.copyTooltip:hover::before {
	opacity: 1;
}

/* Font-awesome CSS */
.fa-2xs {
	font-size: 1.5rem;
}
.fa-1xs {
	font-size: 1rem;
}

/* Sections */
.column::-webkit-scrollbar {
	width: 0px;
	height: 0px;
}
.column {
	padding-bottom: 2rem;
}
.column,
.singlepagecol {
	filter: drop-shadow(0px 2px 12px rgba(0, 0, 0, 0.08)) drop-shadow(0px 4px 32px rgba(0, 0, 0, 0.12));
}
.section {
	width: 100%;
	border-radius: 16px;
	position: relative;
}
.section.closed > .sectionHead {
	border-radius: 1rem;
}
.section.closed > .sectionContent {
	display: none;
}
.sectionHead {
	width: 100%;
	height: 3.5rem;
	padding: 0.25rem 2rem;
	border-radius: 1rem 1rem 0rem 0rem;
	background: var(--main-color-base);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 1.25rem;
}
.divTitle {
	font-size: 1.5rem;
}
.sectionContent {
	min-height: 4rem;
	/*max-height: 75svh;*/
	background: #fff;
	border-radius: 0rem 0rem 1rem 1rem;
	overflow: hidden;
}

/* Agenda */
#agendaContent {
	height: 75svh;
}
.weekListItem {
	border-right: 4px solid;
	padding: 1rem 1.5rem;
	white-space: nowrap;
	color: var(--light-gray-4);
	cursor: pointer;
}
.weekListItem:hover {
	background: var(--light-gray-3) !important;
}
.weekListItem:not(:last-child) {
	border-bottom: 1px solid var(--light-gray-2);
}
.weekCol:not(:nth-child(6)) {
	border-right: 1px solid var(--light-gray-2);
}
.weekListItem > span:nth-child(2) {
	font-weight: 700;
}
.weeksNav {
	width: 7%;
	flex: 0 0 7%;
	overflow: auto;
}
.weeksNavLabels {
	font-size: 0.75rem;
}
.weekCol {
	overflow-y: auto;
	flex: 0 0 18.6%;
}
.weekDayHeader {
	padding: 1rem 0rem;
	background: var(--light-gray-1);
	position: sticky;
	top: 0px;
	z-index: 1;
}
.weekDayHeader > span:nth-child(1) {
	font-weight: 700;
}
.weekDayHeader > span:nth-child(2) {
	font-size: 1rem;
}

.weeklyBlock {
	width: 100%;
	padding-right: 0.5rem;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 0.5rem;
}

.emptyDay {
	height: 100%;
	background-color: var(--main-color-96);
	border-radius: 8px;
}

.meetArea {
	border-bottom: 1px solid var(--light-gray-2);
}
.meetBody {
	width: calc(100% - 8px);
	margin: 4px;
	padding: 4px;
	border: 1px solid var(--light-gray-3);
	background: var(--light-gray-2);
	border-radius: 0.5rem;
	position: relative;
}
.blockedBlock {
	position: absolute;
	inset: 0px;
	background: var(--light-gray-2);
	border-radius: inherit;
	overflow: hidden;
}

.blockedBlock > * {
	position: absolute;
}
.blockedBlock > :nth-child(1) {
	font-size: 6rem;
	inset: 50%;
	transform: translate(-50%, -50%);
	color: var(--light-gray-3);
	opacity: 0.75;
}
.blockedBlock > :nth-child(2) {
	text-transform: uppercase;
	inset: 0;
	place-items: center;
	color: var(--light-gray-5);
}
.blockedBlock > :nth-child(2) > :nth-child(2) {
	font-size: 0.75rem;
}
.meetHeader,
.meetContent {
	padding: 0.25rem 0.75rem;
}
.meetHeader {
	width: 100%;
	min-width: 0;
	border-radius: 5px;
	font-weight: 700;
	background: var(--main-color-base);
	color: var(--white-color);
	white-space: nowrap;
}
.meetConfirm {
	color: var(--COLOR_CONFIRM);
}
.meetObjective {
	flex: 1 1 0%;
	text-transform: uppercase;
	font-size: 0.75rem;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.meetResult {
	margin: 2px;
	border-radius: 2px;
}

.hasResult {
	color: var(--light-gray-4);
}

.hasResult .svgLink {
	color: inherit;
}

.hasResult .svgLink:hover {
	color: var(--light-gray-5);
}

.hasResult .meetHeader {
	background: linear-gradient(90deg, #ddd 0%, #eeeeee);
	color: inherit;
}

.weeksNav::-webkit-scrollbar,
.weekCol::-webkit-scrollbar {
	width: 0px;
	height: 0px;
}
.fancyInputField * {
	margin: 0px;
	padding: 0px;
	border: 0px;
	outline: none;
	line-height: 1rem !important;
	box-sizing: border-box !important;
}
.fancyInput {
	margin: 0px;
	padding: 0.25rem 1rem 0.1rem;
	border-bottom: 1px solid var(--light-gray-4);
	color: var(--light-gray-4);
}
.fancyInput:not(:has([type="date"])) {
	width: 14rem;
}
.fancyInput span {
	color: var(--main-color-base) !important;
}
input[type="date"]::-webkit-calendar-picker-indicator {
	margin-left: -1rem;
	padding: 0px;
	border: 0px;
	left: 0px;
	right: 0px;
	/*display: none;*/
}
select:not(.placeholder) {
	color: var(--main-color-base);
}
select.placeholder {
	color: var(--light-gray-5);
}
.resultsTable thead {
	background: var(--light-gray-2);
	border: 1px solid var(--light-gray-3);
	border-radius: 1rem 1rem 0rem 0rem;
}

.resultsTable th {
	padding: 0 1rem !important;
}
.resultsTable tbody {
	font-size: 0.75rem !important;
}
.resultsTable td,
.resultsTable th {
	min-width: 8rem;
	padding: 0.5rem 1rem;
	height: calc(3.25rem - 1px);
}
.resultsTable th {
	color: var(--main-color-base) !important;
}
.resultsTable tbody tr {
	border-bottom: 1px solid var(--light-gray-3);
}
.resultsTable {
	color: var(--main-color-base);
}
.resultsTable td:not(:has(.twoRowBox)) {
	white-space: nowrap;
}
.twoRowBox {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	line-clamp: 2;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	margin: 0px;
}
.actionsCell {
	width: fit-content;
	height: 100%;
	font-size: 1rem;
}
md-table-pagination * {
	height: fit-content !important;
	flex-grow: 0 !important;
	width: fit-content !important;
}
md-table-pagination {
	border: 0px !important;
	gap: 2rem;
}
md-table-pagination .limit-select {
	margin: 0px !important;
}
md-table-pagination .label {
	padding: 0px;
	margin: 0px;
	color: var(--light-gray-5);
	font-size: 0.75rem;
	font-weight: 400;
	line-height: normal;
}
.md-table-pagination md-select {
	min-width: fit-content;
	padding: 0px 0.25rem;
}

#sectionEstatisticas {
	padding: 2rem;
}

#metricsWrapper {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(3, 1fr) auto repeat(4, 1fr);
	grid-template-rows: auto auto;
	gap: 1.5rem 0rem;
}
#metricsWrapper > .metricsGroup:nth-child(1) {
	grid-column: 2 / span 2;
	margin-left: 0.25rem;
}
#metricsWrapper > .metricsGroup:nth-child(2) {
	grid-column: 5 / span 2;
	margin-right: 0.25rem;
}
#metricsWrapper > .metricsGroup:nth-child(3) {
	grid-column: span 3;
}
#metricsWrapper > .metricsGroup:nth-child(4) {
	grid-column: span 4;
}
#metricsWrapper > #divider {
	grid-column-start: 4;
	padding: 1rem;
}
#metricsWrapper > #divider.shortDivider {
	grid-row: 1 / 1;
}
#metricsWrapper > #divider.longDivider {
	grid-row: 1 / span 2;
}
#metricsWrapper > #divider > * {
	width: 1px;
	height: 100%;
	border: 1px solid var(--light-gray-3);
}
#moreMetrics {
	grid-column: 8;
	grid-row: 1;
}

.metricsGroup {
	position: relative;
	display: inline-flex;
	gap: 0.5rem;
}
.metricsBoard {
	padding: 1rem;
	flex: 1;
	position: relative;
	z-index: 1;
	background: var(--light-gray-1);
	border-radius: 4px;
}
.metricHeader {
	width: 100%;
	display: inline-flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.5rem;
	font-weight: 700;
}
.metricsGroup::before {
	content: "";
	position: absolute;
	z-index: 0;
	background: var(--light-gray-3);
	inset: -0.5rem;
	border-radius: 8px;
}
.metricTitle {
	font-size: 0.75rem;
	font-weight: 700;
}
.metricDesc {
	font-size: 0.75rem;
	font-weight: 400;
	color: var(--light-gray-5);
}
.metricValue,
.metricTitle,
.metricDesc {
	padding: 0px;
	margin: 0px;
}
.md-tooltip {
	width: 35vw;
	height: fit-content;
	margin: 0px;
	max-width: max-content;
	white-space: normal;
	padding: 0.5rem !important;
	border-radius: 0.25rem;
	background: var(--main-color-base) !important;
	color: white !important;
	transition-duration: 150ms;
	transition-property: transform, background;
	transform: translateY(0.75rem) !important;
	opacity: 0 !important;
	pointer-events: none !important;
	font-size: 0.875rem;
	line-height: normal;
}

.md-tooltip.md-show {
	transform: translateY(-0.5rem) scaleY(1) !important;
	opacity: 0.9 !important;
}

.smallTooltip {
	font-size: 0.75rem;
}
.toggleAbleMetrics,
.toggleAbleMetrics > .metricsBoard {
	opacity: 0;
}

md-progress-circular * {
	transition-property: none !important;
}

.followup-background {
	background: linear-gradient(90deg, var(--main-color-base) 50%, var(--COLOR_CONFIRM));
}

.democall-background {
	background: linear-gradient(90deg, var(--main-color-base) 50%, var(--COLOR_DEMO));
}

.visita-background {
	background: linear-gradient(90deg, var(--main-color-base) 50%, var(--COLOR_AGEND));
}

.acompanhamento-background {
	background: linear-gradient(90deg, var(--main-color-base) 50%, var(--COLOR_AGUARDA));
}

.section-filters {
	padding: 1rem;
	display: flex;
	gap: 1rem;
	align-items: center;
	background: var(--light-gray-1);
	border-bottom: 1px solid var(--light-gray-2);
}

.square-button {
	display: inline-block !important;
	line-height: 36px !important;
	min-height: 36px !important;
	min-width: 0 !important;
	aspect-ratio: 1 / 1 !important;
}

.base-card {
	border: 1px solid #eee;
	border-radius: 0.5rem;
	background-color: #f9fafb;
	color: #333;

	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.base-card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.base-card-header-title {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 1.25rem;
}

.base-card-header-title :first-child {
	color: var(--accent-color);
}

.base-card-header-title .title {
	font-weight: 500;
}

.log-card {
	padding: 1rem;
}

.full-page-loader {
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(3px);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 99;
}

.full-page-loader-card {
	background: #fff;
	border: 1px solid var(--color-line);
	border-radius: 16px;
	padding: 18px 22px;
	display: flex;
	align-items: center;
	gap: 12px;
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
	font-weight: 700;
	color: var(--color-ink);
}

@keyframes loader-spin {
	to {
		transform: rotate(360deg);
	}
}

.spinner {
	width: 18px;
	height: 18px;
	border-radius: 999px;
	border: 2px solid #cbd5f5;
	border-top-color: var(--color-accent);
	animation: loader-spin 0.9s linear infinite;
}

.md-tab-content,
md-tabs-content-wrapper {
	position: block !important;
	min-height: unset !important;
}

neo-tabs {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

neo-tabs-header {
	width: 100%;
	display: flex;
	position: relative;
	font-size: 0.875rem;
	text-transform: uppercase;
	color: var(--light-gray-5);
}

neo-tabs .tab {
	padding: 0.75rem 1.5rem;
	cursor: pointer;
}

neo-tabs-header .tab:not(.active-tab):hover {
	background: var(--light-gray-2);
}

neo-tabs-header.active-tab {
	color: var(--accent-color);
}

neo-tabs-header:before {
	content: "";
	position: absolute;
	top: 100%;
	height: 2px;
	background: var(--accent-color);
}
.tabs-slider > * {
	min-width: 100%;
	box-sizing: border-box;
}
.tabs-body-container {
	width: 100%;
	overflow: hidden; /* Esconde as abas que não estão na tela */
}

.tabs-slider {
	display: flex;
	transition: transform 0.3s ease; /* Animação suave */
}

/* Garante que cada conteúdo de aba ocupe 100% da largura do slider */
.tabs-slider > div {
	min-width: 100%;
	width: 100%;
	box-sizing: border-box;
}