/* FONTS */
@font-face {
	font-family: 'JBSDisplay Regular';
	src: url('../fonts/JBSDisplay-Regular.ttf');
}

@font-face {
	font-family: 'JBSDisplay ExtraBold';
	src: url('../fonts/JBSDisplay-ExtraBold.ttf');
}

@font-face {
	font-family: 'JBSText Regular';
	src: url('../fonts/JBSText-Regular.ttf');
}

@font-face {
	font-family: 'JBSText Light';
	src: url('../fonts/JBSText-Light.ttf');
}

@font-face {
	font-family: 'JBSText Medium';
	src: url('../fonts/JBSText-Medium.ttf');
}

@font-face {
	font-family: 'JBSText Medium 2';
	src: url('../fonts/JBSText-Medium\ 2.ttf');
}

@font-face {
	font-family: 'JBSText SemiBold';
	src: url('../fonts/JBSText-SemiBold.ttf');
}

@font-face {
	font-family: 'JBSText Bold';
	src: url('../fonts/JBSText-Bold.ttf');
}

@font-face {
	font-family: 'Nucleo';
	src: url('../fonts/nucleo.ttf');
}

/* RESET */
*,
*::after,
*::before {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

img {
	display: block;
}

/* VARIABLES */
:root {
	--light-blue: #E7F4FA;
	--dark-blue: #282363;
	--ocean-blue: #C5E7F3;
	--ocean-blue-2: #95D8F2;
	--sky: #D4F4FF;
	--gray: #7E8796;
	--white: #FFF;
	--br-size: 30px;

	/* login screen colors */
	--login-bg-color: #162A52;
	--login-gradient-1: #5BC3B2;
	--login-gradient-2: #37B5E4;
	--login-txt-block: #037AA5;
}

/* GENERAL STYLES */
body {
	background-color: var(--light-blue);
	min-height: 100vh;
	position: relative;
	color: var(--dark-blue);
	font-family: 'JBSText Regular', sans-serif;
	/* font-size: clamp(.75rem, 0.8vw, 1rem); */
	text-wrap: nowrap;

	display: flex;
	justify-content: center;
}

main {
	position: absolute;
	max-width: 1500px;
	height: 892px;
	margin: 2rem;
	border-radius: var(--br-size);
	display: flex;
}

/* MENU */
#menu {
	height: 892px;
	/* height: 100%; */
	width: calc(300px - 24px);
	border-radius: var(--br-size);
	background-color: var(--white);
	padding: 35px 0;
	font-family: 'JBSText Light', sans-serif;
	transition: all .5s ease;
	position: relative;
}

#menu figure {
	display: flex;
	justify-content: center;
}

/* SEARCH BAR */
#menu .search-bar {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-top: 20%;
}

#menu .search-bar input {
	background-color: var(--ocean-blue);
	border: none;
	border-radius: var(--br-size);
	padding: 14px;
	width: 100%;
}

#menu .search-bar input::placeholder {
	color: var(--dark-blue);
	font-weight: bold;
	font-family: 'JBSText Light', sans-serif;
}

#menu .search-bar p {
	font-size: 10px;
	font-weight: 700;
	font-family: 'JBSText Light', sans-serif;
}

.search-input-wrapper {
	position: relative;
	display: flex;
	align-items: center;
}

.search-input-wrapper.is-loading input {
	padding-right: 2rem;
}

.spinner-border {
	position: absolute;
	right: 0.75rem;
	width: 1rem;
	height: 1rem;
}

.search-input-wrapper {
	position: relative;
}

.search-input-wrapper.is-loading input {
	background-color: #f3f4f6;
}

.search-bar p.searching span {
	font-weight: 500;
}

/* MENU BODY */
#menu .menu-body {
	padding-top: 30px;
	padding-left: 85px;
}

#menu .menu-body h4 {
	position: relative;
	cursor: pointer;
	font-size: 15px;
	margin-left: 6px;
}

#menu .menu-body .latest-orders {
	position: relative;
	width: fit-content;
}

#menu .menu-body .latest-orders h4::before {
	position: absolute;
	top: -35%;
	left: -32%;
	content: url('../img/icons/order.png');
}

#menu .menu-body .latest-orders ul {
	list-style-type: none;
	margin-top: 8px;
	height: 0;
	overflow: hidden;
	font-size: 12px;
	transition: all .5s ease;
}

#menu .menu-body .latest-orders ul li {
	border-top: 1px solid rgba(125, 134, 150, 0.5);
	padding: 3px 0;
	cursor: pointer;
}

#menu .menu-body .latest-orders ul li a {
	text-decoration: none;
}

#menu .menu-body .latest-orders ul li span {
	padding: 1px 6px;
	border-radius: var(--br-size);
}

#menu .menu-body .latest-orders ul li span:hover {
	background-color: var(--ocean-blue);	
}

#menu .menu-body .latest-orders ul li:first-of-type {
	border-top: none;
}

#menu .menu-body .date {
	line-height: 1.3;
	margin-top: 20px;
	width: fit-content;
}

#menu .menu-body .date span {
	font-size: 12px;
}

#menu .menu-body .date .select-date {
	display: block;
	font-size: 12px;
	font-weight: bold;
	color: var(--gray);
	cursor: pointer;
	margin: 0px 0px 8px 6px;
}

#menu .menu-body .date h4::before {
	position: absolute;
	top: -2%;
	left: -34%;
	content: url('../img/icons/calendar.png');
}

#menu .menu-body .date .date-input {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 3px 0;
	gap: 4px;
}

#menu .menu-body .period-range {
	margin-top: 18px;
    width: fit-content;
}

#menu .menu-body .period-range h4::before {
	position: absolute;
	top: -35%;
	left: -54%;
	content: url('../img/icons/p_range.png');
}

#menu .menu-body .period-range ul {
	list-style-type: none;
	margin-top: 8px;
	height: 0;
	overflow: hidden;
	font-size: 12px;
	transition: all .5s ease;
}

#menu .menu-body .period-range ul li {
	padding: 3px 0;
	cursor: pointer;
}

#menu .menu-body .period-range ul li span {
	padding: 1px 6px;
	border-radius: var(--br-size);
}

#menu .menu-body .period-range ul li span:hover {
	background-color: var(--ocean-blue);	
}

#menu .menu-body .period-range a {
	text-decoration: none;
	padding: 0;
	color: var(--dark-blue);
}

#menu .menu-body .users-management {
	margin-top: 18px;
    width: fit-content;
}

#menu .menu-body .users-management a {
	text-decoration: none;
}

#menu .menu-body .users-management h4::before {
	position: absolute;
	top: -35%;
	left: -31%;
	content: url('../img/icons/order.png');
}

#menu .support-and-logout {
	position: absolute;
	bottom: 4%;
	padding-left: 85px;
	cursor: pointer;

	display: flex;
	flex-direction: column;
	gap: 25px;
}

#menu .support-and-logout div {
	position: relative;
}

#menu .support-and-logout a {
	text-decoration: none;
	color: var(--dark-blue);
	font-weight: bold;
	font-size: 15px;
	margin-left: 6px;
}

#menu .support-and-logout .support::before {
	position: absolute;
	top: -10%;
	left: -60%;
	content: url('../img/icons/support.png');
}

#menu .support-and-logout .logout::before {
	position: absolute;
	top: -10%;
	left: -57%;
	content: url('../img/icons/logout.png');
}

/* DASHBOARD */
#dashboard {
	height: 100%;
	margin: 0 24px;
	display: grid;
	grid-template-columns: repeat(3, 377px);
	grid-template-rows: 5% 20% 5% repeat(6, 1fr);
	gap: 1.4rem;
}

/* header */
.header {
	grid-column: 1 / 4;
	grid-row: 1 / 2;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 2rem;
}

.header .button {
	background-color: var(--white);
	border-radius: 50%;
	border: none;
	width: 40px;
	height: 40px;
	cursor: pointer;
	display: none;
}

.header .button .menu-icon,
.header .button .menu-icon::before,
.header .button .menu-icon::after {
	background-color: var(--dark-blue);
	width: 26px;
	height: 3px;
	border-radius: 5px;
	position: absolute;
}

.header .button .menu-icon::before,
.header .button .menu-icon::after {
	content: "";
}

.header .button .menu-icon::after {
	transform: translate(-13px, -8px);
}

.header .button .menu-icon::before {
	transform: translate(-13px, 8px);
}

.header .left {
	display: flex;
	align-items: center;
	gap: 32px;
}

.header .user {
	display: flex;
	align-items: center;
	gap: .8rem;
}

.header .user figure {
	display: inline-block;
	border-radius: 50%;
	background-color: var(--ocean-blue);
	width: 40px;
	height: 40px;
}

.header .user .rounded-circle {
	display: inline-block;
	border-radius: 50%;
	background-color: var(--ocean-blue);
	width: 40px;
	height: 40px;
}

.header .lang {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	top: 0px !important;
	right: 0px !important;
	cursor: pointer;
}

.header .lang i {
	display: inline-block;
	width: 26px;
	height: 26px;
	background-color: var(--dark-blue);
	color: var(--white);
	border-radius: 100%;
	vertical-align: middle;
	text-align: center;
	line-height: 26px;
	font-size: 16px;
}

.header .lang small {
	display: inline-block;
	margin-left: 3px;
	text-transform: uppercase;
	vertical-align: middle;
	font-weight: bold;
	font-size: 11px;
}

.header .lang span.lang-menu {
	display: none;
	position: absolute;
	top: 25px;
	right: 12px;
	width: auto;
	z-index: 1;
}

.header .lang span.lang-menu b a {
	display: block;
	text-transform: uppercase;
	text-decoration: none;
	padding: 10px;
	background-color: var(--ocean-blue);
	border-radius: 6px;
	font-weight: bold;
	font-size: 11px;
	color: var(--dark-blue);
	transition: all 0.3s ease;
}

.header .lang span.lang-menu b a:hover {
	background-color: var(--dark-blue);
	color: var(--white);
}

.header .lang:hover span.lang-menu {
	display: block;
}

/* main image */
figure.main-image {
	display: flex;
	justify-content: center;
	align-items: center;
}

figure.main-image img {
	height: 165%;
}

/* welcome */
div.welcome {
	display: flex;
	align-items: center;
}

div.welcome p {
	font-family: 'JBSText Light', sans-serif;
	/* font-size: clamp(1.2rem, 2.4vw, 2.8rem); */
	font-size: 2.8rem;
	line-height: 1;
}

/* details text */
p.details-text {
	display: flex;
	justify-content: center;
	align-items: center;
	font-family: 'Nucleo', sans-serif;
	/* font-size: clamp(.8rem, 1.1vw, 1.3rem); */
	font-size: 1.3rem;
}

/* upload */
div.upload {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: .5rem;
}

div.upload figure {
	background-color: var(--white);
	border-radius: 50%;
	aspect-ratio: 4 / 4;
	height: 100%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* period */
div.period {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 0 1.8rem;
	font-family: 'JBSText Light', sans-serif;
	font-weight: bold;
}

/* estimated numbers */
div.estimated-numbers {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: .5rem;
	color: var(--white);
	padding: 0 1.8rem;
}

div.estimated-numbers img {
	/* width: clamp(10px, 10vw, 25px); */
	width: 25px;
	height: auto;
}

/* counter & side-counter */
.counter,
.side-counter {
	border-radius: var(--br-size);
}

/* counter */
.counter {
	background-color: var(--white);
	position: relative;
}

.counter.one {
	grid-column: 1 / 2;
	grid-row: 4 / 7;
	display: flex;
	justify-content: center;
	align-items: center;
}

.counter.two {
	grid-column: 2 / 3;
	grid-row: 4 / 7;
	display: flex;
	justify-content: center;
	align-items: center;
}

.counter.three {
	grid-column: 1 / 2;
	grid-row: 7 / 10;
	display: flex;
	justify-content: center;
	align-items: center;
}

.counter.four {
	grid-column: 2 / 3;
	grid-row: 7 / 10;
	display: flex;
	justify-content: center;
	align-items: center;
}

.top-side {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	padding: 6% 6% 0 7%;
	font-family: 'JBSText Light', sans-serif;
	font-weight: bold;
	display: flex;
	justify-content: space-between;
}

.top-side a {
	cursor: pointer;
}

.bottom-side {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 0% 7% 6% 0%;
}

.bottom-side img {
	height: 40px;
}

/* side-counter */
.side-counter {
	background-color: var(--dark-blue);
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1.2rem;
	padding-right: 12%;
	position: relative;
}

.side-counter>img {
	/* width: clamp(80px, 7vw, 120px); */
	width: 120px;
	position: absolute;
	left: 50%;
	transform: translate(20px, 0px);
}

.side-counter.one {
	grid-column: 3 / 4;
	grid-row: 4 / 6;
}

.side-counter.two {
	grid-column: 3 / 4;
	grid-row: 6 / 8;
}

.side-counter.three {
	grid-column: 3 / 4;
	grid-row: 8 / 10;
}

.side-counter span {
	position: absolute;
	left: 0;
	top: 0;
	padding: 6% 6% 0 7%;
	color: var(--white);
}

.side-counter .side-figure {
	position: absolute;
	right: 50%;
	/* width: clamp(50px, 7vw, 110px); */
	width: 110px;
	transform: translate(-20px, 10px);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: .5rem;
}

.side-counter .side-figure img:nth-child(1) {
	/* height: clamp(20px, 3vw, 40px); */
	height: 40px;
}

.side-counter .side-figure img:nth-child(2) {
	/* height: clamp(40px, 4vw, 60px); */
	height: 40px;
}

/* dashboard counter one-2 */
#dashboard .counter.one-2 {
	grid-column: 1 / 2;
	grid-row: 4 / 7;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#dashboard .counter.one-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#dashboard .counter.one-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#dashboard .counter.one-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard .counter.one-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard .counter.one-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard .counter.one-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard .counter.one-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* admin-dashboard counter two-2 */
#dashboard .counter.two-2 {
	grid-column: 2 / 3;
	grid-row: 4 / 7;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#dashboard .counter.two-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#dashboard .counter.two-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#dashboard .counter.two-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard .counter.two-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard .counter.two-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard .counter.two-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard .counter.two-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* admin-dashboard counter three-2 */
#dashboard .counter.three-2 {
	grid-column: 1 / 2;
	grid-row: 7 / 10;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#dashboard .counter.three-2 .table {
	font-size: 12px;
	position: absolute;
	top: 27%;
	left: 18%;
	width: 75.2%;
}

#dashboard .counter.three-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#dashboard .counter.three-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard .counter.three-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard .counter.three-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard .counter.three-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard .counter.three-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* admin-dashboard counter four-2 */
#dashboard .counter.four-2 {
	grid-column: 2 / 3;
	grid-row: 7 / 10;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#dashboard .counter.four-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#dashboard .counter.four-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#dashboard .counter.four-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard .counter.four-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard .counter.four-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard .counter.four-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard .counter.four-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* DASHBOARD 2 */
#dashboard-2 {
	height: 100%;
	margin: 0 24px;
	display: grid;
	grid-template-columns: repeat(3, 377px);
	grid-template-rows: 5% 5% repeat(4, 124px) 171px;
	gap: 1.4rem;
}

#dashboard-2 div.upload {
	justify-content: flex-start;
}

/* counter */
#dashboard-2 .counter .left-side {
	position: absolute;
	width: 25px;
	height: 100%;
}

#dashboard-2 .counter .top-side div {
	display: flex;
	align-items: center;
	gap: 12px;
}

#dashboard-2 .counter .top-side div img {
	height: 30px;
}

#dashboard-2 .counter .top-side div span:nth-child(2) {
	font-size: 25px;
}

#dashboard-2 .counter .circle {
	position: absolute;
	right: 3%;
	top: 7%;
	cursor: pointer;
}

#dashboard-2 .counter figure {
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: flex-end;
}

#dashboard-2 .counter figure img {
	width: 80%;
}

#dashboard-2 .counter.one {
	grid-column: 1 / 2;
	grid-row: 3 / 5;
	align-items: flex-end;
	padding-bottom: 7%;
}

#dashboard-2 .counter.one-2 {
	grid-column: 1 / 2;
	grid-row: 3 / 5;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#dashboard-2 .counter.one-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.4%;
}

#dashboard-2 .counter.one-2 .table span {
	display: inline-block;
	margin-left: 10px;
}

#dashboard-2 .counter.one-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard-2 .counter.one-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard-2 .counter.one-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard-2 .counter.one-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.two {
	grid-column: 2 / 3;
	grid-row: 3 / 5;
	align-items: flex-end;
	padding-bottom: 7%;
}

#dashboard-2 .counter.three {
	grid-column: 1 / 2;
	grid-row: 5 / 7;
	padding-top: 8%;
}

#dashboard-2 .counter.four {
	grid-column: 2 / 3;
	grid-row: 5 / 7;
	padding-top: 6%;
	padding-bottom: 7%;
}

#dashboard-2 .counter.five {
	grid-column: 3 / 4;
	grid-row: 3 / 4;
	padding: 20px 0 15px 0;
}

#dashboard-2 .counter.five p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -10px);
	top: 50%;
}

#dashboard-2 .counter.five .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#dashboard-2 .counter.five .table span {
	display: inline-block;
	text-transform: uppercase;
	margin-left: 5px;
}

#dashboard-2 .counter.five .table header {
	margin-bottom: 12px;
}

#dashboard-2 .counter.five .table header span:first-child {
	width: 71%;
}

#dashboard-2 .counter.five .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.five .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.five .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.five .table .tb-body .tb-row span:first-child {
	width: 71%;
}

#dashboard-2 .counter.five-2,
#dashboard-2 .counter.six-2,
#dashboard-2 .counter.seven-2,
#dashboard-2 .counter.eight-2 {
	grid-column: 3 / 4;
	grid-row: 3 / 7;
	padding: 20px 0 15px 0;
	display: none;
}

#dashboard-2 .counter.five-2 p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -10px);
	top: 11%;
}

#dashboard-2 .counter.five-2 .table {
	height: 100%;
	width: 82%;
	margin-left: 15%;
	margin-right: 3.7%;
	font-size: 12px;
}

#dashboard-2 .counter.five-2 .table span {
	display: inline-block;
	text-transform: uppercase;
	margin-left: 5px;
}

#dashboard-2 .counter.five-2 .table header {
	margin-bottom: 12px;
}

#dashboard-2 .counter.five-2 .table header span:first-child {
	width: 65%;
}

#dashboard-2 .counter.five-2 .table .tb-body {
	/* height: calc(54vh - 13px); */
	height: 500px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard-2 .counter.five-2 .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.five-2 .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.five-2 .table .tb-body .tb-row span:first-child {
	width: 65%;
}

#dashboard-2 .counter.five-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.five-2 .circle {
	position: absolute;
	right: 3%;
	top: 1.6%;
}

#dashboard-2 .counter.six {
	grid-column: 3 / 4;
	grid-row: 4 / 5;
	padding: 20px 0 15px 0;
}

#dashboard-2 .counter.six p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -8px);
	top: 50%;
}

#dashboard-2 .counter.six .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#dashboard-2 .counter.six .table span {
	margin-left: 5px;
	text-transform: uppercase;
	display: inline-block;
}

#dashboard-2 .counter.six .table header {
	margin-bottom: 12px;
}

#dashboard-2 .counter.six .table header span:first-child {
	width: 30%;
}

#dashboard-2 .counter.six .table header span:nth-child(2) {
	width: 20%;
}

#dashboard-2 .counter.six .table header span:nth-child(3) {
	width: 25%;
}

#dashboard-2 .counter.six .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.six .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.six .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.six .table .tb-body .tb-row span:first-child {
	width: 34%;
}

#dashboard-2 .counter.six .table .tb-body .tb-row span:nth-child(2) {
	width: 16%;
}

#dashboard-2 .counter.six .table .tb-body .tb-row span:nth-child(3) {
	width: 25%;
}

#dashboard-2 .counter.seven {
	grid-column: 3 / 4;
	grid-row: 5 / 6;
	padding: 20px 0 15px 0;
}

#dashboard-2 .counter.seven p.title {
	position: absolute;
	text-transform: uppercase;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -11px);
	top: 50%;
}

#dashboard-2 .counter.seven .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#dashboard-2 .counter.seven .table span {
	margin-left: 5px;
	text-transform: uppercase;
	display: inline-block;
}

#dashboard-2 .counter.seven .table header {
	margin-bottom: 12px;
}

#dashboard-2 .counter.seven .table header span:first-child {
	width: 37.6%;
}

#dashboard-2 .counter.seven .table header span:nth-child(2) {
	width: 30.6%;
}

#dashboard-2 .counter.seven .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.seven .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.seven .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.seven .table .tb-body .tb-row span:first-child {
	width: 38%;
}

#dashboard-2 .counter.seven .table .tb-body .tb-row span:nth-child(2) {
	width: 30%;
}

#dashboard-2 .counter.eight {
	grid-column: 3 / 4;
	grid-row: 6 / 7;
	padding: 20px 0 15px 0;
}

#dashboard-2 .counter.eight p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -17px);
	top: 50%;
}

#dashboard-2 .counter.eight .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#dashboard-2 .counter.eight .table span {
	margin-left: 5px;
	text-transform: uppercase;
	display: inline-block;
}

#dashboard-2 .counter.eight .table header {
	margin-bottom: 12px;
}

#dashboard-2 .counter.eight .table header span:first-child {
	width: 20%;
}

#dashboard-2 .counter.eight .table header span:nth-child(2) {
	width: 30.6%;
}

#dashboard-2 .counter.eight .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.eight .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.eight .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.eight .table .tb-body .tb-row span:first-child {
	width: 30%;
}

#dashboard-2 .counter.eight .table .tb-body .tb-row span:nth-child(2) {
	width: 21%;
}

/* REGRAS GERAIS PARA TODOS OS MODAIS */
#dashboard-2 .counter[class*="-2"] {
	display: none;
	z-index: 2;
	background-color: var(--ocean-blue);
}

/* MODAL ONE-2 (mantenha seu estilo existente) */
#dashboard-2 .counter.one-2 {
	grid-column: 1 / 2;
	grid-row: 3 / 5;
	align-items: flex-end;
	padding-bottom: 7%;
}

/* NOVOS ESTILOS PARA OS OUTROS MODAIS */
#dashboard-2 .counter.two-2 {
	grid-column: 2 / 3;
	grid-row: 3 / 5;
	align-items: flex-end;
	padding-bottom: 7%;
}

#dashboard-2 .counter.three-2 {
	grid-column: 1 / 2;
	grid-row: 5 / 7;
	padding-top: 8%;
}

#dashboard-2 .counter.four-2 {
	grid-column: 2 / 3;
	grid-row: 5 / 7;
	padding-top: 6%;
	padding-bottom: 7%;
}

#dashboard-2 .counter.six-2 {
	grid-column: 3 / 4;
	grid-row: 3 / 7;
	padding: 20px 0 15px 0;
	display: none;
}

#dashboard-2 .counter.six-2 p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -8px);
	top: 11%;
}

#dashboard-2 .counter.six-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#dashboard-2 .counter.six-2 .table header {
	text-transform: uppercase;
	margin-bottom: 12px;
}

#dashboard-2 .counter.six-2 .table header span:first-child {
	width: 28%;
}

#dashboard-2 .counter.six-2 .table header span:nth-child(2) {
    width: 20%;
}

#dashboard-2 .counter.six-2 .table header span:nth-child(3) {
    width: 25%;
}

#dashboard-2 .counter.six-2 .table .tb-body {
	/* height: calc(54vh - 13px); */
	height: 500px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard-2 .counter.six-2 .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.six-2 .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.six-2 .table .tb-body .tb-row span:first-child {
	width: 32%;
}

#dashboard-2 .counter.six-2 .table .tb-body .tb-row span:nth-child(2) {
    width: 16%;
}

#dashboard-2 .counter.six-2 .table .tb-body .tb-row span:nth-child(3) {
    width: 25%;
}

#dashboard-2 .counter.six-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.six-2 .circle {
	position: absolute;
	right: 3%;
    top: 1.6%;
    cursor: pointer;
}

#dashboard-2 .counter.seven-2 {
	grid-column: 3 / 4;
	grid-row: 3 / 7;
	padding: 20px 0 15px 0;
	display: none;
}

#dashboard-2 .counter.seven-2 p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -11px);
	top: 11%;
}

#dashboard-2 .counter.seven-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#dashboard-2 .counter.seven-2 .table header {
	text-transform: uppercase;
	margin-bottom: 12px;
}

#dashboard-2 .counter.seven-2 .table header span:first-child {
	width: 35.6%;
}

#dashboard-2 .counter.seven-2 .table header span:nth-child(2) {
    width: 29.6%;
}

#dashboard-2 .counter.seven-2 .table .tb-body {
	/* height: calc(54vh - 13px); */
	height: 500px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard-2 .counter.seven-2 .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.seven-2 .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.seven-2 .table .tb-body .tb-row span:first-child {
	width: 35.5%;
}

#dashboard-2 .counter.seven-2 .table .tb-body .tb-row span:nth-child(2) {
    width: 30%;
}

#dashboard-2 .counter.seven-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.seven-2 .circle {
	position: absolute;
	right: 3%;
    top: 1.6%;
	cursor: pointer;
}

#dashboard-2 .counter.eight-2 {
	grid-column: 3 / 4;
	grid-row: 3 / 7;
	padding: 20px 0 15px 0;
	display: none;
}

#dashboard-2 .counter.eight-2 p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -17px);
	top: 11%;
}

#dashboard-2 .counter.eight-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#dashboard-2 .counter.eight-2 .table header {
	text-transform: uppercase;
	margin-bottom: 12px;
}

#dashboard-2 .counter.eight-2 .table header span:first-child {
	width: 21%;
}

#dashboard-2 .counter.eight-2 .table header span:nth-child(2) {
    width: 28%;
}

#dashboard-2 .counter.eight-2 .table .tb-body {
	/* height: calc(54vh - 13px); */
	height: 500px;
	overflow-y: auto;
	overflow-x: hidden;
}

#dashboard-2 .counter.eight-2 .table .tb-body .tb-row span {
	color: var(--gray);
}

#dashboard-2 .counter.eight-2 .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#dashboard-2 .counter.eight-2 .table .tb-body .tb-row span:first-child {
	width: 30%;
}

#dashboard-2 .counter.eight-2 .table .tb-body .tb-row span:nth-child(2) {
    width: 30%;
}

#dashboard-2 .counter.eight-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.eight-2 .circle {
	position: absolute;
	right: 3%;
    top: 1.6%;
	cursor: pointer;
}

/* ESTILOS INDIVIDUAIS PARA AS TABELAS NOS MODAIS */
#dashboard-2 .counter.two-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.two-2 .table .tb-body {
    /* height: calc(20vh - 11px); */
    height: 179px;
    overflow-y: auto;
    overflow-x: hidden;
}

#dashboard-2 .counter.two-2 .table span {
    display: inline-block;
    margin-left: 10px;
}

#dashboard-2 .counter.two-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard-2 .counter.two-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard-2 .counter.two-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 15.5%;
    width: 77.8%;
}

#dashboard-2 .counter.three-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 17%;
	width: 76%;
	height: 65%;
}

#dashboard-2 .counter.four-2 .table {
	font-size: 12px;
	position: absolute;
	top: 22%;
	left: 16%;
	width: 77%;
}

#dashboard-2 .counter.three-2 .table .tb-body {
    /* height: calc(20vh - 11px); */
    height: 179px;
    overflow-y: auto;
    overflow-x: hidden;
}

#dashboard-2 .counter.three-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard-2 .counter.three-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard-2 .counter.three-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.three-2 .table span {
    display: inline-block;
    margin-left: 15px;
}

#dashboard-2 .counter.four-2 .table .tb-body {
    /* height: calc(20vh - 11px); */
    height: 179px;
    overflow-y: auto;
    overflow-x: hidden;
}

#dashboard-2 .counter.four-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#dashboard-2 .counter.four-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#dashboard-2 .counter.four-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#dashboard-2 .counter.four-2 .table span {
    display: inline-block;
    margin-left: 10px;
}

#dashboard-2 .counter.six-2 .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 3%;
	font-size: 12px;
}

#dashboard-2 .counter.seven-2 .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 3%;
	font-size: 12px;
}

#dashboard-2 .counter.eight-2 .table {
	margin-left: 15%;
	margin-right: 3.6%;
	height: 100%;
	font-size: 12px;
}

/* REGRAS COMUNS PARA TABELAS NOS MODAIS */

#dashboard-2 .counter[class*="-2"] .table .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

/* side counter */
#dashboard-2 .side-counter.one {
	grid-column: 1 / 2;
	grid-row: 7 / 8;
}

#dashboard-2 .side-counter.two {
	grid-column: 2 / 3;
	grid-row: 7 / 8;
}

#dashboard-2 .side-counter.three {
	grid-column: 3 / 4;
	grid-row: 7 / 8;
}

/* ADMIN-DASHBOARD */
#admin-dashboard {
	height: 100%;
	margin: 0 24px;
	display: grid;
	grid-template-columns: repeat(3, 377px);
	grid-template-rows: 5% 20% 5% repeat(6, 1fr);
	gap: 1.4rem;
}

#admin-dashboard .create-new-user {
	grid-column: 3 / 4;
	background-color: var(--dark-blue);
	color: var(--white);
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: var(--br-size);
	padding: 0 8px 0 25px;
}

/* client list article */
#admin-dashboard .client-list {
	grid-column: 1 / 2;
	background-color: var(--white);
	border-radius: var(--br-size);
	padding: 20px 15px 15px 25px;
}

#admin-dashboard .client-list .title {
	font-family: 'JBSText Medium';
	font-size: 15px;
}

#admin-dashboard .client-list .table {
	margin-top: 40px;
	font-size: 12px;
}

#admin-dashboard .client-list .table header {
	display: flex;
	justify-content: flex-start;
	gap: 0;
	margin-bottom: 10px;
}

#admin-dashboard .client-list .table header p.tb-title-1 {
	margin-right: 35px;
}

#admin-dashboard .client-list .table .tb-body {
	/* height: calc(75vh - 300px); */
	height: 420px;
	overflow-y: auto;
	overflow-x: hidden;
}

#admin-dashboard .client-list .table .tb-row {
	display: flex;
	cursor: pointer;
}

#admin-dashboard .client-list .table .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
}

#admin-dashboard .client-list .table .tb-row p {
	padding: 3px 0;
	color: var(--gray);
}

#admin-dashboard .client-list .table .tb-row p.code {
	margin-right: 20px;
}

#admin-dashboard .client-list .table .tb-row .code {
	flex: 0 0 50px;
	/* Não cresce, não encolhe, largura fixa de 100px */
}

#admin-dashboard .client-list .table .tb-row .name {
	flex: 1;
	/* Cresce para ocupar o espaço restante */
	text-align: left;
	/* Opcional, para alinhar o texto à esquerda */
}

/* users list article */
#admin-dashboard .users-list {
	grid-column: 2 / 3;
	background-color: var(--white);
	border-radius: var(--br-size);
	padding: 20px 15px 15px 25px;
}

#admin-dashboard .users-list .title {
	font-family: 'JBSText Medium';
	font-size: 15px;
}

#admin-dashboard .users-list .table {
	margin-top: 40px;
	font-size: 12px;
}

#admin-dashboard .users-list .table header {
	display: flex;
	justify-content: flex-start;
	margin-bottom: 10px;
}

#admin-dashboard .users-list .table header p.tb-title-1 {
	margin-right: 31px;
}

#admin-dashboard .users-list .table .tb-body {
	/* height: calc(75vh - 300px); */
	height: 420px;
	overflow-y: auto;
	overflow-x: hidden;
}

#admin-dashboard .users-list .table .tb-row {
	display: flex;
	padding: 3px 0;
	color: var(--gray);
}

#admin-dashboard .users-list .table .tb-row p.num {
	margin: 0 10.43px;
}

#admin-dashboard .users-list .table .tb-row p.email {
	margin-left: 30px;
}

#admin-dashboard .users-list .table .tb-row .email {
	text-align: left;
	/* Opcional, para alinhar o texto à esquerda */
}

#admin-dashboard .users-list .table .tb-row input {
	border: none;
	font-size: 12px;
	color: var(--dark-blue);
	background: none;
	cursor: pointer;
}

#admin-dashboard .users-list .table .tb-row input[type="button"][value="SEND"] {
	margin-left: auto;
}

#admin-dashboard .users-list .table .tb-row input[type="button"][value="EDIT"] {
	margin: 0 12px;
}

/* user details article */
#admin-dashboard .user-details {
	grid-column: 3 / 4;
	background-color: var(--dark-blue);
	border-radius: var(--br-size);
	padding: 20px 15px 15px 25px;
}

#admin-dashboard .user-details .title {
	font-family: 'JBSText Medium';
	font-size: 15px;
	color: var(--white);
}

#admin-dashboard .user-details form {
	margin-top: 40px;
	display: flex;
	flex-direction: column;
	gap: 15px;
}

#admin-dashboard .user-details form input[type="text"],
#admin-dashboard .user-details form input[type="password"],
#admin-dashboard .user-details form input[type="email"] {
	background-color: var(--white);
	border: none;
	border-radius: var(--br-size);
	padding: 14px 20px;
	width: 97.6%;
	outline: none;
}

#admin-dashboard .user-details input::placeholder {
	color: var(--dark-blue);
	font-family: 'JBSText Regular', sans-serif;
}

#admin-dashboard .user-details .buttons {
	padding: 5px 20px;
}

#admin-dashboard .user-details .buttons input {
	border: none;
	color: var(--light-blue);
	font-family: 'JBSText Regular';
	background-color: inherit;
	cursor: pointer;
}

#admin-dashboard .user-details .buttons input:first-of-type {
	margin-right: 45px;
}

#admin-dashboard .counter.one-2 {
	grid-column: 1 / 2;
	grid-row: 4 / 7;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#admin-dashboard .counter.one-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#admin-dashboard .counter.one-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#admin-dashboard .counter.one-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#admin-dashboard .counter.one-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#admin-dashboard .counter.one-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#admin-dashboard .counter.one-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#admin-dashboard .counter.one-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* admin-dashboard counter two-2 */
#admin-dashboard .counter.two-2 {
	grid-column: 2 / 3;
	grid-row: 4 / 7;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#admin-dashboard .counter.two-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#admin-dashboard .counter.two-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#admin-dashboard .counter.two-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#admin-dashboard .counter.two-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#admin-dashboard .counter.two-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#admin-dashboard .counter.two-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#admin-dashboard .counter.two-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* admin-dashboard counter three-2 */
#admin-dashboard .counter.three-2 {
	grid-column: 1 / 2;
	grid-row: 7 / 10;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#admin-dashboard .counter.three-2 .table {
	font-size: 12px;
	position: absolute;
	top: 27%;
	left: 18%;
	width: 75.2%;
}

#admin-dashboard .counter.three-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#admin-dashboard .counter.three-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#admin-dashboard .counter.three-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#admin-dashboard .counter.three-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#admin-dashboard .counter.three-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#admin-dashboard .counter.three-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* admin-dashboard counter four-2 */
#admin-dashboard .counter.four-2 {
	grid-column: 2 / 3;
	grid-row: 7 / 10;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#admin-dashboard .counter.four-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#admin-dashboard .counter.four-2 .table span {
	display: inline-block;
	margin-left: 5px;
}

#admin-dashboard .counter.four-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#admin-dashboard .counter.four-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#admin-dashboard .counter.four-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#admin-dashboard .counter.four-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#admin-dashboard .counter.four-2 .top-side div {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Charts */
.chart-container {
	pointer-events: none;
}


/* tela de login */
#login {
	max-width: 1500px;
	width: 100%;
	background-color: var(--login-bg-color);
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

#login .form figure {
	position: absolute;
	top: 6%;
	left: 5%;
}

#login .form form {
	display: flex;
	flex-direction: column;
	gap: 10px;

	font-family: 'JBSText Light', sans-serif;
	font-size: 14px;
	color: var(--white);

	position: absolute;
	top: 50%;
	left: 13%;
	transform: translate(0px, -140px);
}

#login .form form input {
	border-radius: var(--br-size);
	outline-style: none;
	border: none;
	padding: 13px 18px;
	width: 330px;
}

#login .form form label {
	margin-left: 15px;
}

#login .form form label[for="user-password"] {
	margin-top: 10px;
}

#login .form form input[type="password"] {
	margin-bottom: 8px;
}

#login .form form input[type="submit"] {
	font-family: 'JBSText Medium';
	background-image: linear-gradient(to right, var(--login-gradient-1), var(--login-gradient-2));
	color: var(--white);
	cursor: pointer;
}

#login .form .forgot-password {
	margin-top: 20px;
	align-self: center;
	text-decoration: none;
	color: var(--white);
}

#login .image {
	display: flex;
	align-items: center;
	padding: 60px 60px 60px 25px;
}

#login .image figure {
	width: 100%;
	height: 100%;
	border-radius: var(--br-size);
	background: url('../img/fundo_jbs.png') no-repeat center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

#login .image figure p.welcome-title {
	font-family: 'JBSDisplay Regular', sans-serif;
	font-size: clamp(20px, 2.5vw, 42px);
	color: var(--white);
	margin-bottom: 30px;
	text-wrap: wrap;
}

#login .image figure p.welcome-txt {
	background-color: var(--login-txt-block);
	color: var(--white);
	border-radius: var(--br-size);
	width: 55%;
	text-wrap: wrap;
	line-height: 1.4;
	padding: 20px 30px;
	position: absolute;
	top: 50%;
	right: 0%;
	transform: translate(25px, 30px);
}

#login .image figure .lang {
	position: absolute;
	top: 2.5%;
	right: 3.5%;
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
}

#login .image figure .lang i {
	display: inline-block;
	width: 26px;
	height: 26px;
	background-color: var(--white);
	color: var(--dark-blue);
	border-radius: 100%;
	vertical-align: middle;
	text-align: center;
	line-height: 26px;
	font-size: 16px;
}

#login .image figure .lang small {
	display: inline-block;
	margin-left: 3px;
	text-transform: uppercase;
	vertical-align: middle;
	font-weight: bold;
	font-size: 11px;
	color: var(--white);
}

.lang {
	position: absolute;
	top: 20px;
	right: 20px;
	display: flex;
	align-items: center;
	gap: 10px;
	z-index: 10;
}

.lang i {
	color: #fff;
	font-size: 20px;
}

.lang select {
	background: transparent;
	border: none;
	color: #fff;
	font-size: 14px;
	cursor: pointer;
	padding: 5px;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.lang select option {
	background: #fff;
	color: #333;
	padding: 5px;
}

/* Esconde a seta padrão do select em navegadores específicos */
.lang select::-ms-expand {
	display: none;
}

/* SEARCH DASHBOARD */
#search-dashboard {
	height: 100%;
	margin: 0 24px;
	display: grid;
	grid-template-columns: repeat(3, 377px);
	grid-template-rows: 5% 5% repeat(4, 124px) 171px;
	gap: 1.4rem;
}

#search-dashboard div.id {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 0 1.8rem;
	font-family: 'JBSText Light', sans-serif;
	font-weight: bold;
}

#search-dashboard div.upload {
	justify-content: start;
}

#search-dashboard .counter .top-side div {
	display: flex;
	align-items: center;
	gap: 12px;
}

#search-dashboard .counter .top-side div img {
	height: 30px;
}

#search-dashboard .counter .top-side div span:nth-child(2) {
	font-size: 25px;
}

#search-dashboard .counter .circle {
	position: absolute;
	right: 3%;
	top: 7%;
	cursor: pointer;
}

#search-dashboard .counter figure {
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: flex-end;
}

#search-dashboard .counter figure img {
	width: 80%;
}

#search-dashboard .counter.one {
	grid-column: 1 / 2;
	grid-row: 3 / 5;
	padding-top: 8%;
}

#search-dashboard .counter.one-2 {
	grid-column: 1 / 2;
	grid-row: 3 / 5;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#search-dashboard .counter.one-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#search-dashboard .counter.one-2 .table span {
	display: inline-block;
	margin-left: 10px;
}

#search-dashboard .counter.one-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#search-dashboard .counter.one-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#search-dashboard .counter.one-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;
	cursor: pointer;
}

#search-dashboard .counter.one-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.two {
	grid-column: 2 / 3;
	grid-row: 3 / 5;
	padding-top: 8%;
}

#search-dashboard .counter.two-2 {
	grid-column: 2 / 3;
	grid-row: 3 / 5;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#search-dashboard .counter.two-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#search-dashboard .counter.two-2 .table span {
	display: inline-block;
	margin-left: 14px;
}

#search-dashboard .counter.two-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#search-dashboard .counter.two-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#search-dashboard .counter.two-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;	
}

#search-dashboard .counter.two-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.two-2 .table .tb-body .tb-row span:first-child {
	width: 8%;
}

#search-dashboard .counter.two-2 .table .tb-body .tb-row span:nth-child(2) {
	width: 55%;
}

#search-dashboard .counter.three {
	grid-column: 1 / 2;
	grid-row: 5 / 7;
	padding-top: 8%;
}

#search-dashboard .counter.three-2 {
	grid-column: 1 / 2;
	grid-row: 5 / 7;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#search-dashboard .counter.three-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#search-dashboard .counter.three-2 .table span {
	display: inline-block;
	margin-left: 14px;
}

#search-dashboard .counter.three-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#search-dashboard .counter.three-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#search-dashboard .counter.three-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;	
}

#search-dashboard .counter.three-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.three-2 .table .tb-body .tb-row span:first-child {
	width: 8%;
}

#search-dashboard .counter.three-2 .table .tb-body .tb-row span:nth-child(2) {
	width: 55%;
}

#search-dashboard .counter.four {
	grid-column: 2 / 3;
	grid-row: 5 / 7;
	padding-top: 8%;
}

#search-dashboard .counter.four-2 {
	grid-column: 2 / 3;
	grid-row: 5 / 7;
	align-items: flex-end;
	background-color: var(--ocean-blue);
	display: none;
}

#search-dashboard .counter.four-2 .table {
	font-size: 12px;
	position: absolute;
	top: 25%;
	left: 18%;
	width: 75.2%;
}

#search-dashboard .counter.four-2 .table span {
	display: inline-block;
	margin-left: 14px;
}

#search-dashboard .counter.four-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 179px;
	overflow-y: auto;
	overflow-x: hidden;
}

#search-dashboard .counter.four-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	text-transform: uppercase;
	color: var(--dark-blue);
	overflow: visible;
	margin: 0 5px;
	padding: 3px 0;
}

#search-dashboard .counter.four-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;	
}

#search-dashboard .counter.four-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.four-2 .table .tb-body .tb-row span:first-child {
	width: 8%;
}

#search-dashboard .counter.four-2 .table .tb-body .tb-row span:nth-child(2) {
	width: 55%;
}

#search-dashboard .counter.five {
	grid-column: 1 / 2;
	grid-row: 7 / 8;
	padding: 45px 0 15px 0;
}

#search-dashboard .counter.five p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, 0px);
	top: 50%;
}

#search-dashboard .counter.five .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#search-dashboard .counter.five .table span {
	display: inline-block;
	text-transform: uppercase;
	margin-left: 5px;
	max-width: 130px;
	/* Defina o tamanho máximo da área de texto */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#search-dashboard .counter.five .table header {
	margin-bottom: 12px;
}

#search-dashboard .counter.five .table header span:first-child {
	width: 8%;
}

#search-dashboard .counter.five .table header span:nth-child(2) {
	width: 55%;
}

#search-dashboard .counter.five .table .tb-body .tb-row span {
	color: var(--gray);
}

#search-dashboard .counter.five .table .tb-body .tb-row span.farm a {
	text-decoration: none;
	color: var(--gray);
}

#search-dashboard .counter.five .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#search-dashboard .counter.five .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.five .table .tb-body .tb-row span:first-child {
	width: 8%;
}

#search-dashboard .counter.five .table .tb-body .tb-row span:nth-child(2) {
	width: 55%;
}

#search-dashboard .counter.five-2 {
	grid-column: 1 / 2;
	grid-row: 7 / 8;
	padding: 20px 0 15px 0;
	background-color: var(--ocean-blue);
	display: none;
}

#search-dashboard .counter.five-2 p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, 0px);
	top: 50%;
}

#search-dashboard .counter.five-2 .table {
	height: 100%;
	margin-left: 12%;
	margin-right: 4%;
	font-size: 12px;
}

#search-dashboard .counter.five-2 .table span {
	display: inline-block;
	text-transform: uppercase;
	margin-left: 5px;
	max-width: 130px;
	/* Defina o tamanho máximo da área de texto */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#search-dashboard .counter.five-2 .table header {
	margin-bottom: 12px;
}

#search-dashboard .counter.five-2 .table header span:first-child {
	width: 8%;
}

#search-dashboard .counter.five-2 .table header span:nth-child(2) {
	width: 55%;
}
#search-dashboard .counter.five-2 .table .tb-body {
	/* height: calc(20vh - 11px); */
	height: 100px;
	overflow-y: auto;
	overflow-x: hidden;
}

#search-dashboard .counter.five-2 .table .tb-body .tb-row span {
	font-family: 'JBSText Light', sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--dark-blue);
	overflow: hidden;
	margin: 0 5px;
	padding: 3px 0;
}

#search-dashboard .counter.five-2 .table .tb-body .tb-row span a {
    text-decoration: none;
}

#search-dashboard .counter.five-2 .table .tb-body .tb-row:hover {
	background-color: var(--light-blue);
	border-radius: var(--br-size);
	width: fit-content;	
	cursor: pointer;
}

#search-dashboard .counter.five-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.five-2 .table .tb-body .tb-row span:first-child {
	width: 8%;
}

#search-dashboard .counter.five-2 .table .tb-body .tb-row span:nth-child(2) {
	width: 55%;
}

#search-dashboard .counter.six {
	grid-column: 2 / 3;
	grid-row: 7 / 8;
	padding: 45px 0 15px 0;
}

#search-dashboard .counter.six p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -10px);
	top: 50%;
}

#search-dashboard .counter.six .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#search-dashboard .counter.six .table span {
	display: inline-block;
	text-transform: uppercase;
	margin-left: 5px;
}

#search-dashboard .counter.six .table header {
	margin-bottom: 12px;
}

#search-dashboard .counter.six .table header span:first-child {
	width: 71%;
}

#search-dashboard .counter.six .table .tb-body .tb-row span {
	color: var(--gray);
}

#search-dashboard .counter.six .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#search-dashboard .counter.six .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.six .table .tb-body .tb-row span:first-child {
	width: 71%;
}

#search-dashboard .counter.six-2 {
	grid-column: 2 / 3;
	grid-row: 7 / 8;
	padding: 45px 0 15px 0;
	background-color: var(--ocean-blue);
	display: none;
}

#search-dashboard .counter.six-2 p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -10px);
	top: 50%;
}

#search-dashboard .counter.six-2 .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#search-dashboard .counter.six-2 .table span {
	display: inline-block;
	text-transform: uppercase;
	margin-left: 5px;
}

#search-dashboard .counter.six-2 .table header {
	margin-bottom: 12px;
}

#search-dashboard .counter.six-2 .table header span:first-child {
	width: 71%;
}

#search-dashboard .counter.six-2 .table .tb-body .tb-row span {
	color: var(--gray);
}

#search-dashboard .counter.six-2 .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#search-dashboard .counter.six-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.six-2 .table .tb-body .tb-row span:first-child {
	width: 71%;
}

#search-dashboard .counter.seven {
	grid-column: 3 / 4;
	grid-row: 7 / 8;
	padding: 45px 0 15px 0;
}

#search-dashboard .counter.seven p.title {
	position: absolute;
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -8px);
	top: 50%;
}

#search-dashboard .counter.seven .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#search-dashboard .counter.seven .table span {
	margin-left: 5px;
	text-transform: uppercase;
	display: inline-block;
}

#search-dashboard .counter.seven .table header {
	margin-bottom: 12px;
}

#search-dashboard .counter.seven .table header span:first-child {
	width: 30%;
}

#search-dashboard .counter.seven .table header span:nth-child(2) {
	width: 20%;
}

#search-dashboard .counter.seven .table header span:nth-child(3) {
	width: 25%;
}

#search-dashboard .counter.seven .table .tb-body .tb-row span {
	color: var(--gray);
}

#search-dashboard .counter.seven .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#search-dashboard .counter.seven .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.seven .table .tb-body .tb-row span:first-child {
	width: 34%;
}

#search-dashboard .counter.seven .table .tb-body .tb-row span:nth-child(2) {
	width: 16%;
}

#search-dashboard .counter.seven .table .tb-body .tb-row span:nth-child(3) {
	width: 25%;
}

#search-dashboard .counter.seven-2 {
	grid-column: 3 / 4;
	grid-row: 7 / 8;
	padding: 45px 0 15px 0;
	background-color: var(--ocean-blue);
	display: none;
}

#search-dashboard .counter.seven-2 p.title {
	position: absolute;	
	text-transform: uppercase;
	transform: rotate(-90deg) translate(8px, -8px);
	top: 50%;
}

#search-dashboard .counter.seven-2 .table {
	height: 100%;
	margin-left: 15%;
	margin-right: 7%;
	font-size: 12px;
}

#search-dashboard .counter.seven-2 .table span {
	margin-left: 5px;
	text-transform: uppercase;
	display: inline-block;
}

#search-dashboard .counter.seven-2 .table header {
	margin-bottom: 12px;
}

#search-dashboard .counter.seven-2 .table header span:first-child {
	width: 30%;
}

#search-dashboard .counter.seven-2 .table header span:nth-child(2) {
	width: 20%;
}

#search-dashboard .counter.seven-2 .table header span:nth-child(3) {
	width: 25%;
}

#search-dashboard .counter.seven-2 .table .tb-body .tb-row span {
	color: var(--gray);
}

#search-dashboard .counter.seven-2 .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#search-dashboard .counter.seven-2 .table .tb-body .tb-row span {
	padding: 3px 0;
}

#search-dashboard .counter.seven-2 .table .tb-body .tb-row span:first-child {
	width: 34%;
}

#search-dashboard .counter.seven-2 .table .tb-body .tb-row span:nth-child(2) {
	width: 16%;
}

#search-dashboard .counter.seven-2 .table .tb-body .tb-row span:nth-child(3) {
	width: 25%;
}

#search-dashboard .counter.map {
	grid-column: 3 / 4;
	grid-row: 3 / 7;
	height: 100%;
	/* Garante que o mapa ocupe o espaço vertical completo */
	width: 100%;
	/* Garante que o mapa ocupe o espaço horizontal completo */
	/* background: url("../img/map-big.png") no-repeat center; 
	/* background-size: cover; */
}

/* FARMS DASHBOARD */
#farms-dashboard {
	height: 100%;
	margin: 0 24px;
	display: grid;
	grid-template-columns: repeat(2, 576.7px);
	grid-template-rows: 5% 5% repeat(2, 367.82px);
	gap: 1.4rem;
}

#farms-dashboard .header {
	grid-column: 1 / 3;
}

#farms-dashboard .farm-buttons {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.4rem;
}

#farms-dashboard .back-button {
	text-decoration: none;
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	height: 100%;
	padding: 0 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	color: var(--dark-blue);
	position: relative;
}

#farms-dashboard .back-button span:nth-child(2) {
	font-size: 10px;
}

#farms-dashboard .back-button span:nth-child(2)::before {
	position: absolute;
	top: 15px;
	left: 126px;
	content: "";
	width: 30px;
	height: 15px;
	background: url('../img/icons/arrow-left.png') no-repeat;
	background-size: contain;
}

#farms-dashboard div.upload {
	grid-column: 2 / 3;
	justify-content: start;
}

#farms-dashboard .counter.origin-verification {
	grid-column: 1 / 2;
	grid-row: 3 / 4;
	padding: 30px;
	font-family: 'JBSText Light', sans-serif;
}

#farms-dashboard .counter.origin-verification h3 {
	margin-bottom: 25px;
}

#farms-dashboard .counter.origin-verification ul {
	list-style: none;
}

#farms-dashboard .counter.origin-verification ul li {
	padding: 6px 0px 6px 50px;
	position: relative;
}

#farms-dashboard .counter.origin-verification ul li:before {
	content: "";
	position: absolute;
	left: 0;
	background: url('../img/icons/right-icon.png') no-repeat;
	background-size: contain;
	width: 20px;
	height: 20px;
}

#farms-dashboard .counter.supply-chain {
	grid-column: 1 / 2;
	grid-row: 4 / 5;
	padding: 30px;
	font-family: 'JBSText Light', sans-serif;
}

#farms-dashboard .counter.supply-chain h3 {
	margin-bottom: 15px;
}

#farms-dashboard .counter.supply-chain ul {
	list-style: none;
	position: relative;
}

#farms-dashboard .counter.supply-chain ul:before {
	content: "";
	position: absolute;
	left: -8px;
	background: url('../img/blue-bar.png') no-repeat;
	background-size: contain;
	width: 35px;
	height: 265px;
}

#farms-dashboard .counter.supply-chain ul li {
	padding: 7px 0px 8px 50px;
}

#farms-dashboard .counter.supply-chain ul li:first-child {
	margin-bottom: 11px;
	padding-top: 12px;
}

#farms-dashboard .counter.supply-chain ul li:last-child {
	margin-top: 100px;
}

#farms-dashboard .counter.supply-chain p {
	font-weight: bold;
	font-size: 18px;
	line-height: 0.8;
}

#farms-dashboard .counter.supply-chain p.refrigerator a {
	text-decoration: none;
	color: var(--dark-blue);
}

#farms-dashboard .counter.supply-chain span {
	color: var(--ocean-blue-2);
	font-size: 10px;
	font-weight: bold;
	text-transform: uppercase;
}

#farms-dashboard .counter.map {
	grid-column: 2 / 3;
	grid-row: 3 / 5;
	height: 100%;
	/* Garante que o mapa ocupe o espaço vertical completo */
	width: 100%;
	/* Garante que o mapa ocupe o espaço horizontal completo */
	/* background: url("../img/map-big.png") no-repeat center; */
	/* background-size: cover; */
}

#farms-dashboard .counter.certifications {
	grid-column: 2 / 3;
	grid-row: 3 / 5;
	padding: 25px 30px;
	font-family: 'JBSText Light', sans-serif;
	text-wrap: wrap;
}

#farms-dashboard .counter.certifications h3 {
	margin-bottom: 25px;
}

#farms-dashboard .counter.certifications p {
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 30px;
}

#farms-dashboard .counter.certifications figure {
	width: 100%;
	display: flex;
	justify-content: center;
}

#farms-dashboard .counter.certifications figure img {
	width: 85%;
}

/* REFRIGERATORS DASHBOARD */
#refrigerators-dashboard {
	height: 100%;
	margin: 0 24px;
	display: grid;
	grid-template-columns: repeat(2, 277.15px) 576.7px;
	grid-template-rows: 5% 5% repeat(2, 367.82px);
	gap: 1.4rem;
}

#refrigerators-dashboard .header {
	grid-column: 3 / 4;
}

#refrigerators-dashboard .farm-buttons {
	grid-column: 1 / 3;
	grid-row: 2 / 3;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.4rem;
}

#refrigerators-dashboard .back-button {
	text-decoration: none;
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	height: 100%;
	padding: 0 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	color: var(--dark-blue);
	position: relative;
}

#refrigerators-dashboard .back-button span:nth-child(2) {
	font-size: 10px;
}

#refrigerators-dashboard .back-button span:nth-child(2)::before {
	position: absolute;
	top: 15px;
	left: 105px;
	content: "";
	width: 30px;
	height: 15px;
	background: url('../img/icons/arrow-left.png') no-repeat;
	background-size: contain;
}

#refrigerators-dashboard div.second-button {
	grid-column: 3 / 4;
	justify-content: start;
	width: 179.23px;
}

#refrigerators-dashboard div.second-button a.back-button.two span:nth-child(2)::before {
	position: absolute;
	top: 15px;
	left: 86px;
	content: "";
	width: 30px;
	height: 15px;
	background: url('../img/icons/arrow-left.png') no-repeat;
	background-size: contain;
}

#refrigerators-dashboard .counter.invoices {
	grid-column: 1 / 2;
	grid-row: 3 / 4;
	padding: 25px;
	font-family: 'JBSText Light', sans-serif;
}

#refrigerators-dashboard .counter.invoices h3 {
	margin-bottom: 25px;
	margin-left: 5px;
}

#refrigerators-dashboard .counter.invoices .table span {
	display: inline-block;
	margin-left: 5px;
}

#refrigerators-dashboard .counter.invoices .table header {
	margin-bottom: 12px;
	font-size: 13px;
	font-weight: bold;
}

#refrigerators-dashboard .counter.invoices .table header span:first-child {
	width: 62%;
}

#refrigerators-dashboard .counter.invoices .table .tb-body .tb-row {
	margin: 3px 0;
}

#refrigerators-dashboard .counter.invoices .table .tb-body .tb-row span {
	color: var(--gray);
	font-size: 12px;
}

#refrigerators-dashboard .counter.invoices .table .tb-body .tb-row:hover {
	background-color: var(--ocean-blue);
	border-radius: var(--br-size);
	cursor: pointer;
}

#refrigerators-dashboard .counter.invoices .table .tb-body .tb-row span {
	padding: 3px 0;
}

#refrigerators-dashboard .counter.invoices .table .tb-body .tb-row span:first-child {
	width: 62%;
}

#refrigerators-dashboard .counter.supply-chain {
	grid-column: 1 / 2;
	grid-row: 4 / 5;
	padding: 30px;
	font-family: 'JBSText Light', sans-serif;
}

#refrigerators-dashboard .counter.supply-chain h3 {
	margin-bottom: 15px;
	margin-left: 5px;
}

#refrigerators-dashboard .counter.supply-chain ul {
	list-style: none;
	margin-top: 55px;
	position: relative;
}

#refrigerators-dashboard .counter.supply-chain ul:before {
	content: "";
	position: absolute;
	left: -7px;
	background: url('../img/blue-bar-2.png') no-repeat;
	background-size: contain;
	width: 35px;
	height: 178px;
}

#refrigerators-dashboard .counter.supply-chain ul li {
	padding-left: 50px;
}

#refrigerators-dashboard .counter.supply-chain ul li:nth-child(1) {
	padding-top: 20px;
}

#refrigerators-dashboard .counter.supply-chain ul li:nth-child(2) {
	padding-top: 40px;
}

#refrigerators-dashboard .counter.supply-chain ul li:nth-child(3) {
	padding-top: 30px;
}

#refrigerators-dashboard .counter.supply-chain p {
	font-weight: bold;
	font-size: 18px;
	line-height: 0.8;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#refrigerators-dashboard .counter.supply-chain span {
	color: var(--ocean-blue-2);
	font-size: 10px;
	font-weight: bold;
}

#refrigerators-dashboard .counter.map {
	grid-column: 3 / 4;
	grid-row: 3 / 5;
	width: 100%;
	height: 100%;
	/* background: url("../img/map-big.png") no-repeat center; */
	/* background-size: cover; */
}

#refrigerators-dashboard .counter.certifications {
	grid-column: 2 / 3;
	grid-row: 3 / 5;
	padding: 25px 30px;
	font-family: 'JBSText Light', sans-serif;
	text-wrap: wrap;
}

#refrigerators-dashboard .counter.certifications h3 {
	margin-bottom: 25px;
}

#refrigerators-dashboard .counter.certifications p {
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 30px;
}

#refrigerators-dashboard .counter.certifications figure {
	width: 100%;
	display: flex;
	justify-content: center;
}

#refrigerators-dashboard .counter.certifications figure img {
	width: 85%;
}

.map-info-window {
    padding: 12px;
    max-width: 250px;
    font-family: var(--font-family);
}

.map-info-window h4 {
    margin: 0 0 8px 0;
    font-size: 14px;
    font-weight: bold;
    color: var(--primary-color);
}

.map-info-window p {
    margin: 4px 0;
    font-size: 12px;
    line-height: 1.4;
}

#map {
    height: 100%;
    width: 100%;
    position: relative;
    border-radius: var(--br-size);
}

/* Animação do Cluster do Mapa */
@keyframes cluster-pulse {
    0% {
        transform: scale(0.95);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.05);
        opacity: 1;
    }
    100% {
        transform: scale(0.95);
        opacity: 0.8;
    }
}

.cluster-marker {
    animation: cluster-pulse 2s infinite ease-in-out;
}

/* Estilo do Cluster */
.cluster-marker img {
    transform-origin: center center;
    animation: cluster-pulse 2s infinite ease-in-out;
}

/* Language Selector Styles */
.select-lang {
    appearance: none;
    background: transparent;
    border: none;
    color: inherit;
    cursor: pointer;
    font-size: inherit;
    padding: 0;
    text-transform: uppercase;
    width: 100%;
}

.select-lang:focus {
    outline: none;
}

.lang:hover .select-lang {
    color: #2d3748;
}

/* estilos extras */
/* -------------- */

.unity {
    font-size: 9px;
}

#dashboard .counter.one-2 .table .tb-row,
#dashboard .counter.two-2 .table .tb-row,
#dashboard .counter.three-2 .table .tb-row,
#dashboard .counter.four-2 .table .tb-row,
#dashboard-2 .counter.one-2 .table .tb-row,
#dashboard-2 .counter.two-2 .table .tb-row,
#dashboard-2 .counter.three-2 .table .tb-row,
#dashboard-2 .counter.four-2 .table .tb-row {
    display: flex;
    line-height: 1.2;
}


#dashboard .counter.one-2 .table .tb-body .tb-row span,
#dashboard .counter.two-2 .table .tb-body .tb-row span,
#dashboard .counter.three-2 .table .tb-body .tb-row span,
#dashboard .counter.four-2 .table .tb-body .tb-row span,
#dashboard-2 .counter.one-2 .table .tb-body .tb-row span,
#dashboard-2 .counter.two-2 .table .tb-body .tb-row span,
#dashboard-2 .counter.three-2 .table .tb-body .tb-row span,
#dashboard-2 .counter.four-2 .table .tb-body .tb-row span {
    padding: 3px 0;
    max-width: 255px;
    overflow: hidden;
    text-overflow: ellipsis;
}