@use './variables' as vars;
@use './mixins' as mix;

.mat-mdc-table {
	background: transparent !important;
	tr {
		th, td {
			padding: vars.$base-padding 10px;
			box-sizing: border-box;

			&:first-child {
				padding-left: 0 !important;
			}

			&:last-child {
				padding-right: 0 !important;
			}
		}
		th {
			padding-top: 0 !important;
		}
	}

	thead {
		th {
			font-size: 14px;
			line-height: 18px;
			color: var(--table-th-font-color);
			font-weight: normal;
			max-height: 52px;
			padding-bottom: 0 !important;
		}
	}

	tbody {
		tr {
			border-radius: 8px;

			td {
				word-break: keep-all;
				white-space: nowrap;
				font-size: 14px;
				line-height: 18px;
				color: var(--font-color);
				@include mix.tablet-low {
					word-break: normal;
					white-space: normal;

				}
			}
		}
	}

	th.mat-mdc-header-cell, td.mat-mdc-footer-cell {
		border: none;
	}
	.mat-mdc-footer-cell {
		color: var(--font-color);
	}
}

.gm-modal-details {
	&__header {
		display: flex;
		align-items: center;

		&__type {
			margin-right: 10px;
		}
	}

	&__form {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
		&__field {
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: center;
			font-size: 15px;
			line-height: 18px;

			.gm-label {
				margin: 0;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			&__value {
				&.no-wrap {
					white-space: nowrap;
				}
			}

			&-comment {
				display: block;
				margin-bottom: 24px;
				word-break: break-word;

				.gm-label {
					padding-bottom: 8px;
					display: block;
				}
			}
		}
	}

	&__date {
		white-space: nowrap;
	}

	&__slitter {
		align-self: flex-end;
		height: 1px;
		margin: 0 10px;
		background: var(--divider-color);
		flex: auto;
	}

	&__actions {
		display: flex;
		flex-direction: column;
		margin-top: 4px;
	}
}
