/*@use "sass:map";
@import "../Global/colors";
@import "../Global/variables";
@import "../Global/mixins";

$hub-detail-container-header-h: 20px;
$hub-detail-container-header-content-h: 70px;
$hub-detail-container-navbar-h: 38px;

.hubDetailContainer {
	padding: $spacing * 2;

	&__header {
		border-radius: map.get($border-radius, md);
		box-shadow: map.get($box-shadow, md);
		overflow: hidden;
		margin-bottom: $spacing * 4;

		&__bg {
			width: 100%;
			background: url('/images/hubBack.png');
			background-size: cover;
			background-position: center;
			height: $hub-detail-container-header-h;
		}

		&__content {
			background-color: $bg-light;
			padding: $spacing * 4;
			width: 100%;
			min-height: $hub-detail-container-header-content-h;
		}
	}

	&__navbar {
		padding-inline: $spacing;
		display: flex;
		flex-wrap: wrap;
		gap: $spacing * 2;
		min-height: $hub-detail-container-navbar-h;
		margin-bottom: $spacing * 4;

		.btn {
			height: unset;
			padding: $spacing * 2 $spacing * 6 !important;
		}
			//Quando si cambiano i ghost e si fanno come materio, togliere queste righe
			.btn.btn--ghost.btn--primary {
				padding: $spacing * 2 $spacing * 6 !important;

				&:hover {
					text-decoration: none;
					background-color: $bg-light;
				}
			}
	}

	&__body {

		$header-h: 64px;
		$footer-h: 50px;

		.mainContainer,
		.detailContainer {
			min-height: unset;
			height: calc(100svh - $header-h - $spacing*4 - 120px - $spacing*4 - $hub-detail-container-navbar-h - $spacing*4 - $footer-h );
			padding-block: 0;
			overflow-y: auto;
		}

		#hubDetailRenderContainer {
			height: 100%;
			padding: $spacing;
		}

		&__dashboard {
			display: flex;
			flex-wrap: wrap;
			gap: $spacing*3;

			.card {
				height: fit-content;
				min-width: 300px;

				&__footer {
					text-align: end;
				}
			}

			&__info {

				.card__body {
					display: flex;
					flex-direction: column;
					gap: $spacing*2;

					> div {
						display: grid;
						grid-template-columns: 30px 1fr;
						align-items: center;
					}
				}
			}
		}
	}
}

.headerCard {
	display: flex;
	justify-content: space-between;

	&__title {
		font-size: 24px;
		margin-bottom: $spacing;
	}

	&__desc {
		display: flex;
		gap: $spacing * 8;
		color: $fg-light;
		padding-left: $spacing * 2;

		i {
			padding-right: $spacing;
		}
	}

	&__buttons {
		min-height: 100%;
		display: flex;
		align-items: center;
	}
}
*/

/*# sourceMappingURL=hubLayout.css.map */
